← Back to Editor

#E0E4A8 · #3C1428 · #F86C44 · #FEA86C · #FEC676

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#E0E4A8

Fresh Green · Wheat · Lemon Cream

HEX
#E0E4A8
RGB
rgb(224, 228, 168)
HSL
hsl(64, 53%, 78%)
HSB
hsb(64, 26%, 89%)
CMYK
cmyk(2%, 0%, 26%, 11%)
Oklch
oklch(90.1% 0.078 111.0)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#3C1428

Dark Violet · DarkSlateGray · Raspberry

HEX
#3C1428
RGB
rgb(60, 20, 40)
HSL
hsl(330, 50%, 16%)
HSB
hsb(330, 67%, 24%)
CMYK
cmyk(0%, 67%, 33%, 76%)
Oklch
oklch(26.2% 0.068 351.7)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#F86C44

Peach Pink · Tomato · Coral Red

HEX
#F86C44
RGB
rgb(248, 108, 68)
HSL
hsl(13, 93%, 62%)
HSB
hsb(13, 73%, 97%)
CMYK
cmyk(0%, 56%, 73%, 3%)
Oklch
oklch(69.7% 0.181 36.7)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#FEA86C

Apricot · SandyBrown · Warm Sun

HEX
#FEA86C
RGB
rgb(254, 168, 108)
HSL
hsl(25, 99%, 71%)
HSB
hsb(25, 57%, 100%)
CMYK
cmyk(0%, 34%, 57%, 0%)
Oklch
oklch(80.4% 0.127 54.8)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#FEC676

Goose Yellow · LightSalmon · Warm Sun

HEX
#FEC676
RGB
rgb(254, 198, 118)
HSL
hsl(35, 99%, 73%)
HSB
hsb(35, 54%, 100%)
CMYK
cmyk(0%, 22%, 54%, 0%)
Oklch
oklch(86.0% 0.117 75.0)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E0E4A8
ADA9E5

Analogous

E5CBA9
E0E4A8
C3E5A9

Triadic

E0E4A8
A9E1E5
E5A9E1

Split-Comp.

E0E4A8
A9C3E5
CBA9E5

Tetradic

E0E4A8
A9E5CB
ADA9E5
E5A9C3

Contrast Matrix WCAG 2.1 Contrast

E0E4A8
3C1428
F86C44
FEA86C
FEC676
—
12.0
AAA
2.2
Fail
1.4
Fail
1.2
Fail
12.0
AAA
—
5.5
AA
8.3
AAA
10.2
AAA
2.2
Fail
5.5
AA
—
1.5
Fail
1.9
Fail
1.4
Fail
8.3
AAA
1.5
Fail
—
1.2
Fail
1.2
Fail
10.2
AAA
1.9
Fail
1.2
Fail
—
White BG
1.3Fail
15.9AAA
2.9Fail
1.9Fail
1.5Fail
Black BG
15.8AAA
1.3Fail
7.2AAA
11.0AAA
13.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E2E2B7
2B2A23
BBBA4E
D9D87B
E6E589

Deuteranopia

E2E1BA
2D3022
C4CE50
DEE47E
E9ED8E

Tritanopia

E0C2C5
3A1F1F
F15557
FA8689
FB999C

Achromatopsia

DCDCDC
222222
919191
BBBBBB
CECECE

Shades & Tints Shades & Tints

#E0E4A8

Dark
Light

#3C1428

Dark
Light

#F86C44

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e0e4a8;
  --color-2: #3c1428;
  --color-3: #f86c44;
  --color-4: #fea86c;
  --color-5: #fec676;
}

SCSS

$color-1: #e0e4a8;
$color-2: #3c1428;
$color-3: #f86c44;
$color-4: #fea86c;
$color-5: #fec676;

TAILWIND

colors: {
  'brand-1': '#e0e4a8',
  'brand-2': '#3c1428',
  'brand-3': '#f86c44',
  'brand-4': '#fea86c',
  'brand-5': '#fec676',
}

RGB Array

[224, 228, 168], [60, 20, 40], [248, 108, 68], [254, 168, 108], [254, 198, 118]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E0E4A8, #3C1428, #F86C44, #FEA86C, #FEC676 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #e0e4a8; --color-2: #3c1428; --color-3: #f86c44; --color-4: #fea86c; --color-5: #fec676. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This general-style 5-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color