← Back to Editor

#E1F3D9 · #D7E5CE · #BBE2D0 · #ACAAAB · #8E9BAB

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E1F3D9

Emerald · Beige · Mint Green

HEX
#E1F3D9
RGB
rgb(225, 243, 217)
HSL
hsl(102, 52%, 90%)
HSB
hsb(102, 11%, 95%)
CMYK
cmyk(7%, 0%, 11%, 5%)
Oklch
oklch(94.4% 0.039 135.9)

Traditional「Emerald」· Paint「Mint Green」· Creative Mint Breeze

#D7E5CE

Celadon · LightGray · Mint Green

HEX
#D7E5CE
RGB
rgb(215, 229, 206)
HSL
hsl(97, 31%, 85%)
HSB
hsb(97, 10%, 90%)
CMYK
cmyk(6%, 0%, 10%, 10%)
Oklch
oklch(90.5% 0.034 133.0)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

#BBE2D0

Jade · LightBlue · Mint Green

HEX
#BBE2D0
RGB
rgb(187, 226, 208)
HSL
hsl(152, 40%, 81%)
HSB
hsb(152, 17%, 89%)
CMYK
cmyk(17%, 0%, 8%, 11%)
Oklch
oklch(88.0% 0.048 165.6)

Traditional「Jade」· Paint「Mint Green」· Creative Arctic Pool

#ACAAAB

Ash · DarkGray · Silver Sand

HEX
#ACAAAB
RGB
rgb(172, 170, 171)
HSL
hsl(330, 1%, 67%)
HSB
hsb(330, 1%, 67%)
CMYK
cmyk(0%, 1%, 1%, 33%)
Oklch
oklch(74.0% 0.003 345.2)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#8E9BAB

Azure · DarkGray · Cobalt Blue

HEX
#8E9BAB
RGB
rgb(142, 155, 171)
HSL
hsl(213, 15%, 61%)
HSB
hsb(213, 17%, 67%)
CMYK
cmyk(17%, 9%, 0%, 33%)
Oklch
oklch(68.4% 0.028 253.6)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E1F3D9
EBD8F3

Analogous

EDF3D8
E1F3D9
D8F3DE

Triadic

E1F3D9
D8E0F3
F3D8E0

Split-Comp.

E1F3D9
DED8F3
F3D8ED

Tetradic

E1F3D9
D8EDF3
EBD8F3
F3DED8

Contrast Matrix WCAG 2.1 Contrast

E1F3D9
D7E5CE
BBE2D0
ACAAAB
8E9BAB
—
1.1
Fail
1.2
Fail
2.0
Fail
2.4
Fail
1.1
Fail
—
1.1
Fail
1.8
Fail
2.2
Fail
1.2
Fail
1.1
Fail
—
1.6
Fail
2.0
Fail
2.0
Fail
1.8
Fail
1.6
Fail
—
1.2
Fail
2.4
Fail
2.2
Fail
2.0
Fail
1.2
Fail
—
White BG
1.2Fail
1.3Fail
1.4Fail
2.3Fail
2.8Fail
Black BG
18.0AAA
16.0AAA
14.9AAA
9.1AAA
7.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9E9DF
DDDDD4
CCCCD4
ABABAB
9494A7

Deuteranopia

E8E6E1
DCDBD5
CAC7D5
ABABAB
9392A6

Tritanopia

E2E4E5
D8D8D9
BDD8D9
ACABAB
8FA4A3

Achromatopsia

EBEBEB
DEDEDE
D4D4D4
ABABAB
999999

Shades & Tints Shades & Tints

#E1F3D9

Dark
Light

#D7E5CE

Dark
Light

#BBE2D0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e1f3d9;
  --color-2: #d7e5ce;
  --color-3: #bbe2d0;
  --color-4: #acaaab;
  --color-5: #8e9bab;
}

SCSS

$color-1: #e1f3d9;
$color-2: #d7e5ce;
$color-3: #bbe2d0;
$color-4: #acaaab;
$color-5: #8e9bab;

TAILWIND

colors: {
  'brand-1': '#e1f3d9',
  'brand-2': '#d7e5ce',
  'brand-3': '#bbe2d0',
  'brand-4': '#acaaab',
  'brand-5': '#8e9bab',
}

RGB Array

[225, 243, 217], [215, 229, 206], [187, 226, 208], [172, 170, 171], [142, 155, 171]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E1F3D9, #D7E5CE, #BBE2D0, #ACAAAB, #8E9BAB is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #e1f3d9; --color-2: #d7e5ce; --color-3: #bbe2d0; --color-4: #acaaab; --color-5: #8e9bab. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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