← Back to Editor

#E9F2EC · #ADADAA · #F8EABB · #E8CFA1 · #C9AD91

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E9F2EC

Celadon · Linen · Mint Green

HEX
#E9F2EC
RGB
rgb(233, 242, 236)
HSL
hsl(140, 26%, 93%)
HSB
hsb(140, 4%, 95%)
CMYK
cmyk(4%, 0%, 2%, 5%)
Oklch
oklch(95.3% 0.012 157.0)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

#ADADAA

Ash · DarkGray · Silver Sand

HEX
#ADADAA
RGB
rgb(173, 173, 170)
HSL
hsl(60, 2%, 67%)
HSB
hsb(60, 2%, 68%)
CMYK
cmyk(0%, 0%, 2%, 32%)
Oklch
oklch(74.7% 0.004 106.5)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#F8EABB

Goose Yellow · Bisque · Lemon Cream

HEX
#F8EABB
RGB
rgb(248, 234, 187)
HSL
hsl(46, 81%, 85%)
HSB
hsb(46, 25%, 97%)
CMYK
cmyk(0%, 6%, 25%, 3%)
Oklch
oklch(93.7% 0.063 93.4)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

#E8CFA1

Goose Yellow · Wheat · Peach Orange

HEX
#E8CFA1
RGB
rgb(232, 207, 161)
HSL
hsl(39, 61%, 77%)
HSB
hsb(39, 31%, 91%)
CMYK
cmyk(0%, 11%, 31%, 9%)
Oklch
oklch(86.4% 0.066 82.6)

TraditionalGoose Yellow」· PaintPeach Orange」· Creative Honey Glow

#C9AD91

Ginger · Tan · Warm Sun

HEX
#C9AD91
RGB
rgb(201, 173, 145)
HSL
hsl(30, 34%, 68%)
HSB
hsb(30, 28%, 79%)
CMYK
cmyk(0%, 14%, 28%, 21%)
Oklch
oklch(76.5% 0.050 67.0)

TraditionalGinger」· PaintWarm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E9F2EC
F2E9EF

Analogous

EAF2E9
E9F2EC
E9F2F0

Triadic

E9F2EC
ECE9F2
F2ECE9

Split-Comp.

E9F2EC
F0E9F2
F2E9EA

Tetradic

E9F2EC
E9EAF2
F2E9EF
F2F0E9

Contrast Matrix WCAG 2.1 Contrast

E9F2EC
ADADAA
F8EABB
E8CFA1
C9AD91
2.0
Fail
1.1
Fail
1.3
Fail
1.9
Fail
2.0
Fail
1.9
Fail
1.5
Fail
1.1
Fail
1.1
Fail
1.9
Fail
1.3
Fail
1.8
Fail
1.3
Fail
1.5
Fail
1.3
Fail
1.4
Fail
1.9
Fail
1.1
Fail
1.8
Fail
1.4
Fail
White BG
1.1Fail
2.2Fail
1.2Fail
1.5Fail
2.1Fail
Black BG
18.4AAA
9.3AAA
17.5AAA
13.9AAA
9.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EDEDED
ADADAB
F2F2C6
DDDDAC
BDBD98

Deuteranopia

ECECEE
ADADAB
F3F4C9
DFE0AF
BFC199

Tritanopia

E9EFEF
ADABAB
F7CFD1
E7B5B7
C89D9E

Achromatopsia

EFEFEF
ADADAD
E9E9E9
D1D1D1
B2B2B2

Shades & Tints Shades & Tints

#E9F2EC

Dark
Light

#ADADAA

Dark
Light

#F8EABB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e9f2ec;
  --color-2: #adadaa;
  --color-3: #f8eabb;
  --color-4: #e8cfa1;
  --color-5: #c9ad91;
}

SCSS

$color-1: #e9f2ec;
$color-2: #adadaa;
$color-3: #f8eabb;
$color-4: #e8cfa1;
$color-5: #c9ad91;

TAILWIND

colors: {
  'brand-1': '#e9f2ec',
  'brand-2': '#adadaa',
  'brand-3': '#f8eabb',
  'brand-4': '#e8cfa1',
  'brand-5': '#c9ad91',
}

RGB Array

[233, 242, 236], [173, 173, 170], [248, 234, 187], [232, 207, 161], [201, 173, 145]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E9F2EC, #ADADAA, #F8EABB, #E8CFA1, #C9AD91 is ideal for: health products, baby brands, fresh-style blogs. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #e9f2ec; --color-2: #adadaa; --color-3: #f8eabb; --color-4: #e8cfa1; --color-5: #c9ad91. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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 tech, SaaS, healthcare, eco industries. 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