← Back to Editor

#ECD0A9 · #FEC750 · #E84466 · #3F9C91 · #312056

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#ECD0A9

Goose Yellow · Wheat · Peach Orange

HEX
#ECD0A9
RGB
rgb(236, 208, 169)
HSL
hsl(35, 64%, 79%)
HSB
hsb(35, 28%, 93%)
CMYK
cmyk(0%, 12%, 28%, 7%)
Oklch
oklch(87.1% 0.060 76.0)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#FEC750

Ginger · SandyBrown · Sunflower

HEX
#FEC750
RGB
rgb(254, 199, 80)
HSL
hsl(41, 99%, 65%)
HSB
hsb(41, 69%, 100%)
CMYK
cmyk(0%, 22%, 69%, 0%)
Oklch
oklch(85.8% 0.146 83.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#E84466

Vermilion · Tomato · Passion Red

HEX
#E84466
RGB
rgb(232, 68, 102)
HSL
hsl(348, 78%, 59%)
HSB
hsb(348, 71%, 91%)
CMYK
cmyk(0%, 71%, 56%, 9%)
Oklch
oklch(63.1% 0.200 13.1)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#3F9C91

Mineral Blue · CadetBlue · Mint Ice

HEX
#3F9C91
RGB
rgb(63, 156, 145)
HSL
hsl(173, 42%, 43%)
HSB
hsb(173, 60%, 61%)
CMYK
cmyk(60%, 0%, 7%, 39%)
Oklch
oklch(63.4% 0.089 184.6)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#312056

Deep Indigo · MidnightBlue · Prussian Blue

HEX
#312056
RGB
rgb(49, 32, 86)
HSL
hsl(259, 46%, 23%)
HSB
hsb(259, 63%, 34%)
CMYK
cmyk(43%, 63%, 0%, 66%)
Oklch
oklch(29.6% 0.094 294.5)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ECD0A9
A7C4EC

Analogous

ECADA7
ECD0A9
E6ECA7

Triadic

ECD0A9
A7ECCF
CFA7EC

Split-Comp.

ECD0A9
A7E6EC
ADA7EC

Tetradic

ECD0A9
A7ECAD
A7C4EC
ECA7E6

Contrast Matrix WCAG 2.1 Contrast

ECD0A9
FEC750
E84466
3F9C91
312056
—
1.0
Fail
2.6
Fail
2.2
Fail
9.6
AAA
1.0
Fail
—
2.5
Fail
2.1
Fail
9.2
AAA
2.6
Fail
2.5
Fail
—
1.2
Fail
3.7
AA Large
2.2
Fail
2.1
Fail
1.2
Fail
—
4.3
AA Large
9.6
AAA
9.2
AAA
3.7
AA Large
4.3
AA Large
—
White BG
1.5Fail
1.6Fail
3.9AA Large
3.3AA Large
14.3AAA
Black BG
14.2AAA
13.5AAA
5.4AA
6.4AA
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E0E0B2
E6E66D
A1A05E
676894
2A2949

Deuteranopia

E2E4B5
E9ED74
ABB75C
625B94
2B2C46

Tritanopia

EBBABC
FB8489
E05756
449696
303F3C

Achromatopsia

D4D4D4
CACACA
797979
7F7F7F
2B2B2B

Shades & Tints Shades & Tints

#ECD0A9

Dark
Light

#FEC750

Dark
Light

#E84466

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ecd0a9;
  --color-2: #fec750;
  --color-3: #e84466;
  --color-4: #3f9c91;
  --color-5: #312056;
}

SCSS

$color-1: #ecd0a9;
$color-2: #fec750;
$color-3: #e84466;
$color-4: #3f9c91;
$color-5: #312056;

TAILWIND

colors: {
  'brand-1': '#ecd0a9',
  'brand-2': '#fec750',
  'brand-3': '#e84466',
  'brand-4': '#3f9c91',
  'brand-5': '#312056',
}

RGB Array

[236, 208, 169], [254, 199, 80], [232, 68, 102], [63, 156, 145], [49, 32, 86]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #ECD0A9, #FEC750, #E84466, #3F9C91, #312056 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: #ecd0a9; --color-2: #fec750; --color-3: #e84466; --color-4: #3f9c91; --color-5: #312056. 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