#D4E3DA + #E0E2CF + #EAE1C5 + #F3E1BB + #FDE1AF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D4E3DA

Celadon · LightGray · Mint Green

HEX

#D4E3DA

RGB

rgb(212, 227, 218)

HSL

hsl(144, 21%, 86%)

HSB

hsb(144, 7%, 89%)

CMYK

cmyk(7%, 0%, 4%, 11%)

Oklch

oklch(90.2% 0.020 159.7)

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

#E0E2CF

Fresh Green · LightGray · Lemon Cream

HEX

#E0E2CF

RGB

rgb(224, 226, 207)

HSL

hsl(66, 25%, 85%)

HSB

hsb(66, 8%, 89%)

CMYK

cmyk(1%, 0%, 8%, 11%)

Oklch

oklch(90.6% 0.025 111.8)

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

#EAE1C5

Goose Yellow · Bisque · Lemon Cream

HEX

#EAE1C5

RGB

rgb(234, 225, 197)

HSL

hsl(45, 47%, 85%)

HSB

hsb(45, 16%, 92%)

CMYK

cmyk(0%, 4%, 16%, 8%)

Oklch

oklch(91.0% 0.038 92.2)

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

#F3E1BB

Goose Yellow · Wheat · Lemon Cream

HEX

#F3E1BB

RGB

rgb(243, 225, 187)

HSL

hsl(41, 70%, 84%)

HSB

hsb(41, 23%, 95%)

CMYK

cmyk(0%, 7%, 23%, 5%)

Oklch

oklch(91.5% 0.054 85.6)

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

#FDE1AF

Goose Yellow · Wheat · Peach Orange

HEX

#FDE1AF

RGB

rgb(253, 225, 175)

HSL

hsl(38, 95%, 84%)

HSB

hsb(38, 31%, 99%)

CMYK

cmyk(0%, 11%, 31%, 1%)

Oklch

oklch(92.1% 0.071 81.9)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D4E3DA

E3D4DD

Analogous

D5E3D4

D4E3DA

D4E3E1

Triadic

D4E3DA

DAD4E3

E3DAD4

Split-Comp.

D4E3DA

E1D4E3

E3D4D5

Tetradic

D4E3DA

D4D5E3

E3D4DD

E3E1D4

Contrast Matrix WCAG 2.1 Contrast

D4E3DA	E0E2CF	EAE1C5	F3E1BB	FDE1AF
—	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

Black BG

15.8AAA

15.9AAA

16.1AAA

16.3AAA

16.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DADBDC

E1E1D4

E6E6CC

EBEBC4

F1F1BB

Deuteranopia

DAD8DD

E1E1D5

E7E7CD

ECEEC6

F3F5BE

Tritanopia

D5DEDE

E0D7D8

EAD1D2

F2CBCD

FCC5C7

Achromatopsia

DDDDDD

DFDFDF

E0E0E0

E2E2E2

E4E4E4

Shades & Tints Shades & Tints

#D4E3DA

Dark

Light

#E0E2CF

Dark

Light

#EAE1C5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d4e3da;
  --color-2: #e0e2cf;
  --color-3: #eae1c5;
  --color-4: #f3e1bb;
  --color-5: #fde1af;
}

SCSS

$color-1: #d4e3da;
$color-2: #e0e2cf;
$color-3: #eae1c5;
$color-4: #f3e1bb;
$color-5: #fde1af;

TAILWIND

colors: {
  'brand-1': '#d4e3da',
  'brand-2': '#e0e2cf',
  'brand-3': '#eae1c5',
  'brand-4': '#f3e1bb',
  'brand-5': '#fde1af',
}

RGB Array

[212, 227, 218], [224, 226, 207], [234, 225, 197], [243, 225, 187], [253, 225, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D4E3DA, #E0E2CF, #EAE1C5, #F3E1BB, #FDE1AF is ideal for: health products, baby brands, fresh-style blogs. 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: #d4e3da; --color-2: #e0e2cf; --color-3: #eae1c5; --color-4: #f3e1bb; --color-5: #fde1af. 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 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