#EEEDF5 + #E6E6E6 + #E9F3F7 + #D9D9DB + #F0FFF4 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#EEEDF5

Wisteria · Lavender · Sky Blue

HEX

#EEEDF5

RGB

rgb(238, 237, 245)

HSL

hsl(248, 29%, 95%)

HSB

hsb(248, 3%, 96%)

CMYK

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

Oklch

oklch(94.9% 0.011 291.9)

Traditional「Wisteria」· Paint「Sky Blue」· Creative Lavender Dream

#E6E6E6

Plain White · Lavender · Cloud White

HEX

#E6E6E6

RGB

rgb(230, 230, 230)

HSL

hsl(0, 0%, 90%)

HSB

hsb(0, 0%, 90%)

CMYK

cmyk(0%, 0%, 0%, 10%)

Oklch

oklch(92.5% 0.000 89.9)

Traditional「Plain White」· Paint「Cloud White」· Creative Silver Lining

#E9F3F7

Sky Blue · Lavender · Glacier Blue

HEX

#E9F3F7

RGB

rgb(233, 243, 247)

HSL

hsl(197, 47%, 94%)

HSB

hsb(197, 6%, 97%)

CMYK

cmyk(6%, 2%, 0%, 3%)

Oklch

oklch(95.8% 0.012 223.5)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#D9D9DB

Silver Gray · LightGray · Pearl Gray

HEX

#D9D9DB

RGB

rgb(217, 217, 219)

HSL

hsl(240, 3%, 85%)

HSB

hsb(240, 1%, 86%)

CMYK

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

Oklch

oklch(88.6% 0.003 286.3)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#F0FFF4

Emerald · Snow · Mint Green

HEX

#F0FFF4

RGB

rgb(240, 255, 244)

HSL

hsl(136, 100%, 97%)

HSB

hsb(136, 6%, 100%)

CMYK

cmyk(6%, 0%, 4%, 0%)

Oklch

oklch(98.6% 0.021 154.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EEEDF5

F5F6EF

Analogous

EFF1F6

EEEDF5

F3EFF6

Triadic

EEEDF5

F6F0EF

EFF6F0

Split-Comp.

EEEDF5

F6F3EF

F1F6EF

Tetradic

EEEDF5

F6EFF1

F5F6EF

EFF6F3

Contrast Matrix WCAG 2.1 Contrast

EEEDF5	E6E6E6	E9F3F7	D9D9DB	F0FFF4
—	1.1 Fail	1.0 Fail	1.2 Fail	1.1 Fail
1.1 Fail	—	1.1 Fail	1.1 Fail	1.2 Fail
1.0 Fail	1.1 Fail	—	1.3 Fail	1.1 Fail
1.2 Fail	1.1 Fail	1.3 Fail	—	1.4 Fail
1.1 Fail	1.2 Fail	1.1 Fail	1.4 Fail	—

White BG

1.2Fail

1.1Fail

1.4Fail

1.0Fail

Black BG

18.1AAA

16.8AAA

18.6AAA

14.9AAA

20.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EEEEF3

E6E6E6

EDEDF6

D9D9DB

F6F7F7

Deuteranopia

EEEEF3

E6E6E6

EDECF6

D9D9DA

F6F5F7

Tritanopia

EEF2F1

E6E6E6

EAF5F5

D9DADA

F1F9F9

Achromatopsia

EEEEEE

E6E6E6

F0F0F0

D9D9D9

F9F9F9

Shades & Tints Shades & Tints

#EEEDF5

Dark

Light

#E6E6E6

Dark

Light

#E9F3F7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #eeedf5;
  --color-2: #e6e6e6;
  --color-3: #e9f3f7;
  --color-4: #d9d9db;
  --color-5: #f0fff4;
}

SCSS

$color-1: #eeedf5;
$color-2: #e6e6e6;
$color-3: #e9f3f7;
$color-4: #d9d9db;
$color-5: #f0fff4;

TAILWIND

colors: {
  'brand-1': '#eeedf5',
  'brand-2': '#e6e6e6',
  'brand-3': '#e9f3f7',
  'brand-4': '#d9d9db',
  'brand-5': '#f0fff4',
}

RGB Array

[238, 237, 245], [230, 230, 230], [233, 243, 247], [217, 217, 219], [240, 255, 244]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EEEDF5, #E6E6E6, #E9F3F7, #D9D9DB, #F0FFF4 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: #eeedf5; --color-2: #e6e6e6; --color-3: #e9f3f7; --color-4: #d9d9db; --color-5: #f0fff4. 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