← Back to Editor

#E1DAC7 · #F6D494 · #3DC5B1 · #009E87 · #004E53

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

#E1DAC7

Goose Yellow · LightGray · Lemon Cream

HEX
#E1DAC7
RGB
rgb(225, 218, 199)
HSL
hsl(44, 30%, 83%)
HSB
hsb(44, 12%, 88%)
CMYK
cmyk(0%, 3%, 12%, 12%)
Oklch
oklch(88.9% 0.027 90.1)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#F6D494

Goose Yellow · Khaki · Peach Orange

HEX
#F6D494
RGB
rgb(246, 212, 148)
HSL
hsl(39, 84%, 77%)
HSB
hsb(39, 40%, 96%)
CMYK
cmyk(0%, 14%, 40%, 4%)
Oklch
oklch(88.4% 0.090 82.8)

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

#3DC5B1

Mineral Blue · MediumTurquoise · Lake Green

HEX
#3DC5B1
RGB
rgb(61, 197, 177)
HSL
hsl(171, 54%, 51%)
HSB
hsb(171, 69%, 77%)
CMYK
cmyk(69%, 0%, 10%, 23%)
Oklch
oklch(74.6% 0.119 181.0)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#009E87

Mineral Blue · Teal · Mint Ice

HEX
#009E87
RGB
rgb(0, 158, 135)
HSL
hsl(171, 100%, 31%)
HSB
hsb(171, 100%, 62%)
CMYK
cmyk(100%, 0%, 15%, 38%)
Oklch
oklch(62.5% 0.116 177.5)

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

#004E53

Lake Blue · DarkSlateGray · Peacock Green

HEX
#004E53
RGB
rgb(0, 78, 83)
HSL
hsl(184, 100%, 16%)
HSB
hsb(184, 100%, 33%)
CMYK
cmyk(100%, 6%, 0%, 67%)
Oklch
oklch(38.6% 0.066 202.2)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E1DAC7
C7CEE1

Analogous

E1CDC7
E1DAC7
DBE1C7

Triadic

E1DAC7
C7E1DA
DAC7E1

Split-Comp.

E1DAC7
C7DBE1
CDC7E1

Tetradic

E1DAC7
C7E1CD
C7CEE1
E1C7DB

Contrast Matrix WCAG 2.1 Contrast

E1DAC7
F6D494
3DC5B1
009E87
004E53
—
1.0
Fail
1.5
Fail
2.4
Fail
6.8
AA
1.0
Fail
—
1.5
Fail
2.4
Fail
6.7
AA
1.5
Fail
1.5
Fail
—
1.6
Fail
4.4
AA Large
2.4
Fail
2.4
Fail
1.6
Fail
—
2.8
Fail
6.8
AA
6.7
AA
4.4
AA Large
2.8
Fail
—
White BG
1.4Fail
1.4Fail
2.1Fail
3.4AA Large
9.5AAA
Black BG
15.1AAA
14.8AAA
9.8AAA
6.2AA
2.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDECC
E7E7A3
7879B6
44468D
222252

Deuteranopia

DEDFCD
E9ECA7
7066B7
3B2F8E
1D1752

Tritanopia

E1CFD0
F4B0B2
44BABB
089192
045151

Achromatopsia

DADADA
D7D7D7
9A9A9A
6C6C6C
373737

Shades & Tints Shades & Tints

#E1DAC7

Dark
Light

#F6D494

Dark
Light

#3DC5B1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e1dac7;
  --color-2: #f6d494;
  --color-3: #3dc5b1;
  --color-4: #009e87;
  --color-5: #004e53;
}

SCSS

$color-1: #e1dac7;
$color-2: #f6d494;
$color-3: #3dc5b1;
$color-4: #009e87;
$color-5: #004e53;

TAILWIND

colors: {
  'brand-1': '#e1dac7',
  'brand-2': '#f6d494',
  'brand-3': '#3dc5b1',
  'brand-4': '#009e87',
  'brand-5': '#004e53',
}

RGB Array

[225, 218, 199], [246, 212, 148], [61, 197, 177], [0, 158, 135], [0, 78, 83]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E1DAC7, #F6D494, #3DC5B1, #009E87, #004E53 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: #e1dac7; --color-2: #f6d494; --color-3: #3dc5b1; --color-4: #009e87; --color-5: #004e53. 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