← Back to Editor

#D2E4E0 · #D5E4DD · #D9E4D9 · #DDE4D5 · #E0E4D2

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D2E4E0

Jade · LightGray · Glacier Blue

HEX
#D2E4E0
RGB
rgb(210, 228, 224)
HSL
hsl(167, 25%, 86%)
HSB
hsb(167, 8%, 89%)
CMYK
cmyk(8%, 0%, 2%, 11%)
Oklch
oklch(90.4% 0.020 181.1)

TraditionalJade」· PaintGlacier Blue」· Creative Arctic Pool

#D5E4DD

Jade · LightGray · Mint Green

HEX
#D5E4DD
RGB
rgb(213, 228, 221)
HSL
hsl(152, 22%, 86%)
HSB
hsb(152, 7%, 89%)
CMYK
cmyk(7%, 0%, 3%, 11%)
Oklch
oklch(90.6% 0.019 166.3)

TraditionalJade」· PaintMint Green」· Creative Arctic Pool

#D9E4D9

Celadon · LightGray · Mint Green

HEX
#D9E4D9
RGB
rgb(217, 228, 217)
HSL
hsl(120, 17%, 87%)
HSB
hsb(120, 5%, 89%)
CMYK
cmyk(5%, 0%, 5%, 11%)
Oklch
oklch(90.7% 0.019 145.4)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

#DDE4D5

Willow Green · LightGray · Mint Green

HEX
#DDE4D5
RGB
rgb(221, 228, 213)
HSL
hsl(88, 22%, 86%)
HSB
hsb(88, 7%, 89%)
CMYK
cmyk(3%, 0%, 7%, 11%)
Oklch
oklch(90.9% 0.021 127.4)

TraditionalWillow Green」· PaintMint Green」· Creative Mint Breeze

#E0E4D2

Willow Green · LightGray · Mint Green

HEX
#E0E4D2
RGB
rgb(224, 228, 210)
HSL
hsl(73, 25%, 86%)
HSB
hsb(73, 8%, 89%)
CMYK
cmyk(2%, 0%, 8%, 11%)
Oklch
oklch(91.1% 0.024 117.1)

TraditionalWillow Green」· PaintMint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D2E4E0
E4D2D6

Analogous

D2E4D7
D2E4E0
D2DFE4

Triadic

D2E4E0
E0D2E4
E4E0D2

Split-Comp.

D2E4E0
E4D2DF
E4D7D2

Tetradic

D2E4E0
D7D2E4
E4D2D6
DFE4D2

Contrast Matrix WCAG 2.1 Contrast

D2E4E0
D5E4DD
D9E4D9
DDE4D5
E0E4D2
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
White BG
1.3Fail
1.3Fail
1.3Fail
1.3Fail
1.3Fail
Black BG
15.9AAA
16.0AAA
16.0AAA
16.1AAA
16.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DADAE1
DBDCDF
DEDEDC
E0E0D9
E2E2D6

Deuteranopia

D9D7E1
DBDADF
DDDCDC
E0DFDA
E2E1D7

Tritanopia

D3E2E2
D6E0E0
DADEDE
DDDBDC
E0DADB

Achromatopsia

DEDEDE
DFDFDF
DFDFDF
E0E0E0
E1E1E1

Shades & Tints Shades & Tints

#D2E4E0

Dark
Light

#D5E4DD

Dark
Light

#D9E4D9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d2e4e0;
  --color-2: #d5e4dd;
  --color-3: #d9e4d9;
  --color-4: #dde4d5;
  --color-5: #e0e4d2;
}

SCSS

$color-1: #d2e4e0;
$color-2: #d5e4dd;
$color-3: #d9e4d9;
$color-4: #dde4d5;
$color-5: #e0e4d2;

TAILWIND

colors: {
  'brand-1': '#d2e4e0',
  'brand-2': '#d5e4dd',
  'brand-3': '#d9e4d9',
  'brand-4': '#dde4d5',
  'brand-5': '#e0e4d2',
}

RGB Array

[210, 228, 224], [213, 228, 221], [217, 228, 217], [221, 228, 213], [224, 228, 210]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D2E4E0, #D5E4DD, #D9E4D9, #DDE4D5, #E0E4D2 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: #d2e4e0; --color-2: #d5e4dd; --color-3: #d9e4d9; --color-4: #dde4d5; --color-5: #e0e4d2. 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