← Back to Editor

#DDE4D3 · #BCCCBE · #949984 · #A9C54C · #EAE3C4

cool

A 5-color cool 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

#DDE4D3

Willow Green · LightGray · Mint Green

HEX
#DDE4D3
RGB
rgb(221, 228, 211)
HSL
hsl(85, 24%, 86%)
HSB
hsb(85, 7%, 89%)
CMYK
cmyk(3%, 0%, 7%, 11%)
Oklch
oklch(90.9% 0.024 125.2)

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

#BCCCBE

Celadon · Silver · Apple Green

HEX
#BCCCBE
RGB
rgb(188, 204, 190)
HSL
hsl(127, 14%, 77%)
HSB
hsb(127, 8%, 80%)
CMYK
cmyk(8%, 0%, 7%, 20%)
Oklch
oklch(82.9% 0.026 149.0)

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

#949984

Grass Green · Gray · Silver Sand

HEX
#949984
RGB
rgb(148, 153, 132)
HSL
hsl(74, 9%, 56%)
HSB
hsb(74, 14%, 60%)
CMYK
cmyk(3%, 0%, 14%, 40%)
Oklch
oklch(67.3% 0.031 118.1)

Traditional「Grass Green」· Paint「Silver Sand」· Creative Urban Concrete

#A9C54C

Grass Green · GreenYellow · Olive Green

HEX
#A9C54C
RGB
rgb(169, 197, 76)
HSL
hsl(74, 51%, 54%)
HSB
hsb(74, 61%, 77%)
CMYK
cmyk(14%, 0%, 61%, 23%)
Oklch
oklch(77.9% 0.150 121.0)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#EAE3C4

Goose Yellow · Wheat · Lemon Cream

HEX
#EAE3C4
RGB
rgb(234, 227, 196)
HSL
hsl(49, 47%, 84%)
HSB
hsb(49, 16%, 92%)
CMYK
cmyk(0%, 3%, 16%, 8%)
Oklch
oklch(91.3% 0.042 96.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DDE4D3
DAD3E4

Analogous

E4E2D3
DDE4D3
D4E4D3

Triadic

DDE4D3
D3DDE4
E4D3DD

Split-Comp.

DDE4D3
D3D4E4
E2D3E4

Tetradic

DDE4D3
D3E4E2
DAD3E4
E4D3D4

Contrast Matrix WCAG 2.1 Contrast

DDE4D3
BCCCBE
949984
A9C54C
EAE3C4
—
1.3
Fail
2.3
Fail
1.5
Fail
1.0
Fail
1.3
Fail
—
1.8
Fail
1.2
Fail
1.3
Fail
2.3
Fail
1.8
Fail
—
1.5
Fail
2.3
Fail
1.5
Fail
1.2
Fail
1.5
Fail
—
1.5
Fail
1.0
Fail
1.3
Fail
2.3
Fail
1.5
Fail
—
White BG
1.3Fail
1.7Fail
2.9Fail
1.9Fail
1.3Fail
Black BG
16.1AAA
12.5AAA
7.1AAA
10.8AAA
16.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E0E0D7
C3C3C1
969689
B5B569
E7E7CC

Deuteranopia

E0DFD8
C2C1C2
96968A
B4B170
E7E8CD

Tritanopia

DDDADB
BDC4C5
948D8E
AA8085
EAD1D3

Achromatopsia

E0E0E0
C6C6C6
959595
AFAFAF
E2E2E2

Shades & Tints Shades & Tints

#DDE4D3

Dark
Light

#BCCCBE

Dark
Light

#949984

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dde4d3;
  --color-2: #bcccbe;
  --color-3: #949984;
  --color-4: #a9c54c;
  --color-5: #eae3c4;
}

SCSS

$color-1: #dde4d3;
$color-2: #bcccbe;
$color-3: #949984;
$color-4: #a9c54c;
$color-5: #eae3c4;

TAILWIND

colors: {
  'brand-1': '#dde4d3',
  'brand-2': '#bcccbe',
  'brand-3': '#949984',
  'brand-4': '#a9c54c',
  'brand-5': '#eae3c4',
}

RGB Array

[221, 228, 211], [188, 204, 190], [148, 153, 132], [169, 197, 76], [234, 227, 196]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #DDE4D3, #BCCCBE, #949984, #A9C54C, #EAE3C4 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: #dde4d3; --color-2: #bcccbe; --color-3: #949984; --color-4: #a9c54c; --color-5: #eae3c4. 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 cool-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