#E3EBCF + #EEF6D9 + #F6FDE3 + #F9FCF1 + #FDFDFD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E3EBCF

Willow Green · Beige · Mint Green

HEX

#E3EBCF

RGB

rgb(227, 235, 207)

HSL

hsl(77, 41%, 87%)

HSB

hsb(77, 12%, 92%)

CMYK

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

Oklch

oklch(92.7% 0.038 120.1)

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

#EEF6D9

Willow Green · Beige · Mint Green

HEX

#EEF6D9

RGB

rgb(238, 246, 217)

HSL

hsl(77, 62%, 91%)

HSB

hsb(77, 12%, 96%)

CMYK

cmyk(3%, 0%, 12%, 4%)

Oklch

oklch(96.0% 0.039 119.7)

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

#F6FDE3

Willow Green · LightYellow · Mint Green

HEX

#F6FDE3

RGB

rgb(246, 253, 227)

HSL

hsl(76, 87%, 94%)

HSB

hsb(76, 10%, 99%)

CMYK

cmyk(3%, 0%, 10%, 1%)

Oklch

oklch(98.2% 0.035 119.3)

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

#F9FCF1

Willow Green · SeaShell · Mint Green

HEX

#F9FCF1

RGB

rgb(249, 252, 241)

HSL

hsl(76, 65%, 97%)

HSB

hsb(76, 4%, 99%)

CMYK

cmyk(1%, 0%, 4%, 1%)

Oklch

oklch(98.6% 0.015 119.1)

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

#FDFDFD

Moonlight White · White · Cloud White

HEX

#FDFDFD

RGB

rgb(253, 253, 253)

HSL

hsl(0, 0%, 99%)

HSB

hsb(0, 0%, 99%)

CMYK

cmyk(0%, 0%, 0%, 1%)

Oklch

oklch(99.4% 0.000 89.9)

Traditional「Moonlight White」· Paint「Cloud White」· Creative Morning Mist

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E3EBCF

D8D0EB

Analogous

EBE6D0

E3EBCF

D6EBD0

Triadic

E3EBCF

D0E4EB

EBD0E4

Split-Comp.

E3EBCF

D0D6EB

E6D0EB

Tetradic

E3EBCF

D0EBE6

D8D0EB

EBD0D6

Contrast Matrix WCAG 2.1 Contrast

E3EBCF	EEF6D9	F6FDE3	F9FCF1	FDFDFD
—	1.1 Fail	1.2 Fail	1.2 Fail	1.2 Fail
1.1 Fail	—	1.1 Fail	1.1 Fail	1.1 Fail
1.2 Fail	1.1 Fail	—	1.0 Fail	1.0 Fail
1.2 Fail	1.1 Fail	1.0 Fail	—	1.0 Fail
1.2 Fail	1.1 Fail	1.0 Fail	1.0 Fail	—

White BG

1.2Fail

1.1Fail

1.0Fail

Black BG

17.1AAA

18.8AAA

20.1AAA

20.2AAA

20.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E6E7D6

F1F2E0

F9F9E9

FAFAF4

FDFDFD

Deuteranopia

E6E5D7

F1F0E2

F9F8EB

FAFAF4

FDFDFD

Tritanopia

E3DBDC

EEE6E7

F6EEEF

F9F6F6

FDFDFD

Achromatopsia

E5E5E5

F0F0F0

F8F8F8

FAFAFA

FDFDFD

Shades & Tints Shades & Tints

#E3EBCF

Dark

Light

#EEF6D9

Dark

Light

#F6FDE3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e3ebcf;
  --color-2: #eef6d9;
  --color-3: #f6fde3;
  --color-4: #f9fcf1;
  --color-5: #fdfdfd;
}

SCSS

$color-1: #e3ebcf;
$color-2: #eef6d9;
$color-3: #f6fde3;
$color-4: #f9fcf1;
$color-5: #fdfdfd;

TAILWIND

colors: {
  'brand-1': '#e3ebcf',
  'brand-2': '#eef6d9',
  'brand-3': '#f6fde3',
  'brand-4': '#f9fcf1',
  'brand-5': '#fdfdfd',
}

RGB Array

[227, 235, 207], [238, 246, 217], [246, 253, 227], [249, 252, 241], [253, 253, 253]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E3EBCF, #EEF6D9, #F6FDE3, #F9FCF1, #FDFDFD 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: #e3ebcf; --color-2: #eef6d9; --color-3: #f6fde3; --color-4: #f9fcf1; --color-5: #fdfdfd. 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