← Back to Editor

#DDE1CA · #FFFFD4 · #DED68E · #A6C6C5 · #818284

warm

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#DDE1CA

Willow Green · LightGray · Mint Green

HEX
#DDE1CA
RGB
rgb(221, 225, 202)
HSL
hsl(70, 28%, 84%)
HSB
hsb(70, 10%, 88%)
CMYK
cmyk(2%, 0%, 10%, 12%)
Oklch
oklch(90.0% 0.031 115.0)

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

#FFFFD4

Fresh Green · LightYellow · Lemon Cream

HEX
#FFFFD4
RGB
rgb(255, 255, 212)
HSL
hsl(60, 100%, 92%)
HSB
hsb(60, 17%, 100%)
CMYK
cmyk(0%, 0%, 17%, 0%)
Oklch
oklch(98.9% 0.055 107.4)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#DED68E

Fresh Green · Khaki · Sunflower

HEX
#DED68E
RGB
rgb(222, 214, 142)
HSL
hsl(54, 55%, 71%)
HSB
hsb(54, 36%, 87%)
CMYK
cmyk(0%, 4%, 36%, 13%)
Oklch
oklch(86.6% 0.092 102.7)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#A6C6C5

Jade · LightSteelBlue · Lake Green

HEX
#A6C6C5
RGB
rgb(166, 198, 197)
HSL
hsl(178, 22%, 71%)
HSB
hsb(178, 16%, 78%)
CMYK
cmyk(16%, 0%, 1%, 22%)
Oklch
oklch(80.3% 0.034 194.2)

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

#818284

Ash · Gray · Warm Gray

HEX
#818284
RGB
rgb(129, 130, 132)
HSL
hsl(220, 1%, 51%)
HSB
hsb(220, 2%, 52%)
CMYK
cmyk(2%, 2%, 0%, 48%)
Oklch
oklch(60.6% 0.003 264.5)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DDE1CA
CFCBE2

Analogous

E2DACB
DDE1CA
D2E2CB

Triadic

DDE1CA
CBDEE2
E2CBDE

Split-Comp.

DDE1CA
CBD2E2
DACBE2

Tetradic

DDE1CA
CBE2DA
CFCBE2
E2CBD2

Contrast Matrix WCAG 2.1 Contrast

DDE1CA
FFFFD4
DED68E
A6C6C5
818284
—
1.3
Fail
1.1
Fail
1.4
Fail
2.9
Fail
1.3
Fail
—
1.5
Fail
1.8
Fail
3.8
AA Large
1.1
Fail
1.5
Fail
—
1.2
Fail
2.6
Fail
1.4
Fail
1.8
Fail
1.2
Fail
—
2.1
Fail
2.9
Fail
3.8
AA Large
2.6
Fail
2.1
Fail
—
White BG
1.3Fail
1.0Fail
1.5Fail
1.8Fail
3.8AA Large
Black BG
15.7AAA
20.5AAA
14.1AAA
11.5AAA
5.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DFDFD0
FFFFDE
DBDA9F
B4B4C5
818184

Deuteranopia

DFDED1
FFFFE1
DBDCA4
B2B0C5
818183

Tritanopia

DDD4D5
FFE7E8
DEADB0
A8C5C5
818383

Achromatopsia

DDDDDD
FAFAFA
D0D0D0
BCBCBC
828282

Shades & Tints Shades & Tints

#DDE1CA

Dark
Light

#FFFFD4

Dark
Light

#DED68E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dde1ca;
  --color-2: #ffffd4;
  --color-3: #ded68e;
  --color-4: #a6c6c5;
  --color-5: #818284;
}

SCSS

$color-1: #dde1ca;
$color-2: #ffffd4;
$color-3: #ded68e;
$color-4: #a6c6c5;
$color-5: #818284;

TAILWIND

colors: {
  'brand-1': '#dde1ca',
  'brand-2': '#ffffd4',
  'brand-3': '#ded68e',
  'brand-4': '#a6c6c5',
  'brand-5': '#818284',
}

RGB Array

[221, 225, 202], [255, 255, 212], [222, 214, 142], [166, 198, 197], [129, 130, 132]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #DDE1CA, #FFFFD4, #DED68E, #A6C6C5, #818284 is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #dde1ca; --color-2: #ffffd4; --color-3: #ded68e; --color-4: #a6c6c5; --color-5: #818284. 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. 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 warm-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