← Back to Editor

#DEE5E6 · #C1CFCE · #C8D5BE · #D0E3AC · #8E8676

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

#DEE5E6

Sky Blue · Lavender · Glacier Blue

HEX
#DEE5E6
RGB
rgb(222, 229, 230)
HSL
hsl(187, 14%, 89%)
HSB
hsb(187, 3%, 90%)
CMYK
cmyk(3%, 0%, 0%, 10%)
Oklch
oklch(91.7% 0.008 207.1)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#C1CFCE

Jade · LightGray · Glacier Blue

HEX
#C1CFCE
RGB
rgb(193, 207, 206)
HSL
hsl(176, 13%, 78%)
HSB
hsb(176, 7%, 81%)
CMYK
cmyk(7%, 0%, 0%, 19%)
Oklch
oklch(84.4% 0.015 191.7)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#C8D5BE

Celadon · Silver · Apple Green

HEX
#C8D5BE
RGB
rgb(200, 213, 190)
HSL
hsl(94, 21%, 79%)
HSB
hsb(94, 11%, 84%)
CMYK
cmyk(6%, 0%, 11%, 16%)
Oklch
oklch(85.7% 0.034 131.4)

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

#D0E3AC

Willow Green · Wheat · Apple Green

HEX
#D0E3AC
RGB
rgb(208, 227, 172)
HSL
hsl(81, 50%, 78%)
HSB
hsb(81, 24%, 89%)
CMYK
cmyk(8%, 0%, 24%, 11%)
Oklch
oklch(88.8% 0.075 123.4)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#8E8676

Ginger · Gray · Sunflower

HEX
#8E8676
RGB
rgb(142, 134, 118)
HSL
hsl(40, 10%, 51%)
HSB
hsb(40, 17%, 56%)
CMYK
cmyk(0%, 6%, 17%, 44%)
Oklch
oklch(62.2% 0.025 84.6)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DEE5E6
E7E0DF

Analogous

DFE7E4
DEE5E6
DFE2E7

Triadic

DEE5E6
E7DFE6
E6E7DF

Split-Comp.

DEE5E6
E7DFE2
E7E4DF

Tetradic

DEE5E6
E4DFE7
E7E0DF
E2E7DF

Contrast Matrix WCAG 2.1 Contrast

DEE5E6
C1CFCE
C8D5BE
D0E3AC
8E8676
—
1.3
Fail
1.2
Fail
1.1
Fail
2.8
Fail
1.3
Fail
—
1.0
Fail
1.2
Fail
2.2
Fail
1.2
Fail
1.0
Fail
—
1.1
Fail
2.4
Fail
1.1
Fail
1.2
Fail
1.1
Fail
—
2.6
Fail
2.8
Fail
2.2
Fail
2.4
Fail
2.6
Fail
—
White BG
1.3Fail
1.6Fail
1.5Fail
1.4Fail
3.6AA Large
Black BG
16.5AAA
13.1AAA
13.7AAA
15.3AAA
5.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E1E1E6
C7C7CE
CECEC4
D8D8B9
8B8A7A

Deuteranopia

E1E0E6
C6C5CE
CDCCC5
D7D6BD
8B8C7B

Tritanopia

DEE6E6
C2CECE
C9C8C9
D1C4C6
8E7D7E

Achromatopsia

E3E3E3
CBCBCB
CECECE
D7D7D7
878787

Shades & Tints Shades & Tints

#DEE5E6

Dark
Light

#C1CFCE

Dark
Light

#C8D5BE

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dee5e6;
  --color-2: #c1cfce;
  --color-3: #c8d5be;
  --color-4: #d0e3ac;
  --color-5: #8e8676;
}

SCSS

$color-1: #dee5e6;
$color-2: #c1cfce;
$color-3: #c8d5be;
$color-4: #d0e3ac;
$color-5: #8e8676;

TAILWIND

colors: {
  'brand-1': '#dee5e6',
  'brand-2': '#c1cfce',
  'brand-3': '#c8d5be',
  'brand-4': '#d0e3ac',
  'brand-5': '#8e8676',
}

RGB Array

[222, 229, 230], [193, 207, 206], [200, 213, 190], [208, 227, 172], [142, 134, 118]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DEE5E6, #C1CFCE, #C8D5BE, #D0E3AC, #8E8676 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: #dee5e6; --color-2: #c1cfce; --color-3: #c8d5be; --color-4: #d0e3ac; --color-5: #8e8676. 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