#EBF2DE + #E3ECDC + #E1E0D1 + #ECD1D4 + #FFDFFF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#EBF2DE

Willow Green · Beige · Mint Green

HEX

#EBF2DE

RGB

rgb(235, 242, 222)

HSL

hsl(81, 43%, 91%)

HSB

hsb(81, 8%, 95%)

CMYK

cmyk(3%, 0%, 8%, 5%)

Oklch

oklch(95.0% 0.027 122.7)

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

#E3ECDC

Celadon · Beige · Mint Green

HEX

#E3ECDC

RGB

rgb(227, 236, 220)

HSL

hsl(94, 30%, 89%)

HSB

hsb(94, 7%, 93%)

CMYK

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

Oklch

oklch(93.2% 0.023 131.1)

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

#E1E0D1

Fresh Green · LightGray · Lemon Cream

HEX

#E1E0D1

RGB

rgb(225, 224, 209)

HSL

hsl(56, 21%, 85%)

HSB

hsb(56, 7%, 88%)

CMYK

cmyk(0%, 0%, 7%, 12%)

Oklch

oklch(90.3% 0.020 103.7)

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

#ECD1D4

Peach Pink · LightGray · Cherry Blossom

HEX

#ECD1D4

RGB

rgb(236, 209, 212)

HSL

hsl(353, 42%, 87%)

HSB

hsb(353, 11%, 93%)

CMYK

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

Oklch

oklch(88.4% 0.030 10.1)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#FFDFFF

Mauve · Lavender · Lavender

HEX

#FFDFFF

RGB

rgb(255, 223, 255)

HSL

hsl(300, 100%, 94%)

HSB

hsb(300, 13%, 100%)

CMYK

cmyk(0%, 13%, 0%, 0%)

Oklch

oklch(93.9% 0.055 326.0)

Traditional「Mauve」· Paint「Lavender」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EBF2DE

E5DEF2

Analogous

F2EFDE

EBF2DE

E1F2DE

Triadic

EBF2DE

DEEBF2

F2DEEB

Split-Comp.

EBF2DE

DEE1F2

EFDEF2

Tetradic

EBF2DE

DEF2EF

E5DEF2

F2DEE1

Contrast Matrix WCAG 2.1 Contrast

EBF2DE	E3ECDC	E1E0D1	ECD1D4	FFDFFF
—	1.1 Fail	1.2 Fail	1.2 Fail	1.1 Fail
1.1 Fail	—	1.1 Fail	1.2 Fail	1.0 Fail
1.2 Fail	1.1 Fail	—	1.1 Fail	1.1 Fail
1.2 Fail	1.2 Fail	1.1 Fail	—	1.2 Fail
1.1 Fail	1.0 Fail	1.1 Fail	1.2 Fail	—

White BG

1.1Fail

1.2Fail

1.3Fail

1.4Fail

1.2Fail

Black BG

18.3AAA

17.3AAA

15.8AAA

14.6AAA

17.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EEEEE3

E7E7E0

E1E1D5

E0E0D3

F1F1F7

Deuteranopia

EEEDE4

E6E6E1

E1E1D6

E2E4D3

F3F5F5

Tritanopia

EBE7E8

E3E3E4

E1D7D8

EBD3D3

FDF1F0

Achromatopsia

EEEEEE

E7E7E7

DFDFDF

D9D9D9

ECECEC

Shades & Tints Shades & Tints

#EBF2DE

Dark

Light

#E3ECDC

Dark

Light

#E1E0D1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ebf2de;
  --color-2: #e3ecdc;
  --color-3: #e1e0d1;
  --color-4: #ecd1d4;
  --color-5: #ffdfff;
}

SCSS

$color-1: #ebf2de;
$color-2: #e3ecdc;
$color-3: #e1e0d1;
$color-4: #ecd1d4;
$color-5: #ffdfff;

TAILWIND

colors: {
  'brand-1': '#ebf2de',
  'brand-2': '#e3ecdc',
  'brand-3': '#e1e0d1',
  'brand-4': '#ecd1d4',
  'brand-5': '#ffdfff',
}

RGB Array

[235, 242, 222], [227, 236, 220], [225, 224, 209], [236, 209, 212], [255, 223, 255]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EBF2DE, #E3ECDC, #E1E0D1, #ECD1D4, #FFDFFF 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: #ebf2de; --color-2: #e3ecdc; --color-3: #e1e0d1; --color-4: #ecd1d4; --color-5: #ffdfff. 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