#ECE9D7 + #D7F1F1 + #E6DCCE + #EECEB7 + #F00E48 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#ECE9D7

Fresh Green · Beige · Lemon Cream

HEX

#ECE9D7

RGB

rgb(236, 233, 215)

HSL

hsl(51, 36%, 88%)

HSB

hsb(51, 9%, 93%)

CMYK

cmyk(0%, 1%, 9%, 7%)

Oklch

oklch(93.2% 0.024 99.1)

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

#D7F1F1

Sky Blue · Lavender · Glacier Blue

HEX

#D7F1F1

RGB

rgb(215, 241, 241)

HSL

hsl(180, 48%, 89%)

HSB

hsb(180, 11%, 95%)

CMYK

cmyk(11%, 0%, 0%, 5%)

Oklch

oklch(93.9% 0.027 196.7)

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

#E6DCCE

Goose Yellow · LightGray · Peach Orange

HEX

#E6DCCE

RGB

rgb(230, 220, 206)

HSL

hsl(35, 32%, 85%)

HSB

hsb(35, 10%, 90%)

CMYK

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

Oklch

oklch(89.9% 0.022 76.5)

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

#EECEB7

Apricot · Wheat · Peach Orange

HEX

#EECEB7

RGB

rgb(238, 206, 183)

HSL

hsl(25, 62%, 83%)

HSB

hsb(25, 23%, 93%)

CMYK

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

Oklch

oklch(87.2% 0.048 57.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#F00E48

Vermilion · Crimson · Passion Red

HEX

#F00E48

RGB

rgb(240, 14, 72)

HSL

hsl(345, 89%, 50%)

HSB

hsb(345, 94%, 94%)

CMYK

cmyk(0%, 94%, 70%, 6%)

Oklch

oklch(60.8% 0.240 18.1)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ECE9D7

D5D9EB

Analogous

EBDDD5

ECE9D7

E4EBD5

Triadic

ECE9D7

D5EBE8

E8D5EB

Split-Comp.

ECE9D7

D5E4EB

DDD5EB

Tetradic

ECE9D7

D5EBDD

D5D9EB

EBD5E4

Contrast Matrix WCAG 2.1 Contrast

ECE9D7	D7F1F1	E6DCCE	EECEB7	F00E48
—	1.0 Fail	1.1 Fail	1.2 Fail	3.5 AA Large
1.0 Fail	—	1.1 Fail	1.3 Fail	3.6 AA Large
1.1 Fail	1.1 Fail	—	1.1 Fail	3.2 AA Large
1.2 Fail	1.3 Fail	1.1 Fail	—	2.9 Fail
3.5 AA Large	3.6 AA Large	3.2 AA Large	2.9 Fail	—

White BG

1.2Fail

1.4Fail

1.5Fail

4.3AA Large

Black BG

17.2AAA

17.7AAA

15.5AAA

14.1AAA

4.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EBEBDB

E2E2F1

E2E2D1

E0E0BD

8E8C3A

Deuteranopia

EBEBDC

E1DFF1

E2E3D2

E2E4BE

9BAC37

Tritanopia

ECDFE0

D8F1F1

E6D4D5

ECC1C2

E52F2C

Achromatopsia

E8E8E8

E9E9E9

DDDDDD

D5D5D5

585858

Shades & Tints Shades & Tints

#ECE9D7

Dark

Light

#D7F1F1

Dark

Light

#E6DCCE

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ece9d7;
  --color-2: #d7f1f1;
  --color-3: #e6dcce;
  --color-4: #eeceb7;
  --color-5: #f00e48;
}

SCSS

$color-1: #ece9d7;
$color-2: #d7f1f1;
$color-3: #e6dcce;
$color-4: #eeceb7;
$color-5: #f00e48;

TAILWIND

colors: {
  'brand-1': '#ece9d7',
  'brand-2': '#d7f1f1',
  'brand-3': '#e6dcce',
  'brand-4': '#eeceb7',
  'brand-5': '#f00e48',
}

RGB Array

[236, 233, 215], [215, 241, 241], [230, 220, 206], [238, 206, 183], [240, 14, 72]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #ECE9D7, #D7F1F1, #E6DCCE, #EECEB7, #F00E48 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: #ece9d7; --color-2: #d7f1f1; --color-3: #e6dcce; --color-4: #eeceb7; --color-5: #f00e48. 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 cool-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