#FDC2E2 + #EECCE4 + #DFD5E5 + #D0DEE6 + #C0E7E7 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FDC2E2

Mauve · Pink · Cherry Blossom

HEX

#FDC2E2

RGB

rgb(253, 194, 226)

HSL

hsl(327, 94%, 88%)

HSB

hsb(327, 23%, 99%)

CMYK

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

Oklch

oklch(87.6% 0.079 345.1)

Traditional「Mauve」· Paint「Cherry Blossom」· Creative Rose Petal

#EECCE4

Mauve · Pink · Lavender

HEX

#EECCE4

RGB

rgb(238, 204, 228)

HSL

hsl(318, 50%, 87%)

HSB

hsb(318, 14%, 93%)

CMYK

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

Oklch

oklch(88.1% 0.049 336.6)

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

#DFD5E5

Lilac · LightGray · Lavender

HEX

#DFD5E5

RGB

rgb(223, 213, 229)

HSL

hsl(278, 24%, 87%)

HSB

hsb(278, 7%, 90%)

CMYK

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

Oklch

oklch(88.6% 0.024 313.1)

Traditional「Lilac」· Paint「Lavender」· Creative Lavender Dream

#D0DEE6

Sky Blue · LightGray · Sky Blue

HEX

#D0DEE6

RGB

rgb(208, 222, 230)

HSL

hsl(202, 31%, 86%)

HSB

hsb(202, 10%, 90%)

CMYK

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

Oklch

oklch(89.2% 0.019 232.5)

Traditional「Sky Blue」· Paint「Sky Blue」· Creative Twilight Haze

#C0E7E7

Sky Blue · LightBlue · Glacier Blue

HEX

#C0E7E7

RGB

rgb(192, 231, 231)

HSL

hsl(180, 45%, 83%)

HSB

hsb(180, 17%, 91%)

CMYK

cmyk(17%, 0%, 0%, 9%)

Oklch

oklch(90.0% 0.041 196.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FDC2E2

C4FDDE

Analogous

FAC4FD

FDC2E2

FDC4C7

Triadic

FDC2E2

E3FDC4

C4E3FD

Split-Comp.

FDC2E2

C7FDC4

C4FDFA

Tetradic

FDC2E2

FDFAC4

C4FDDE

C4C7FD

Contrast Matrix WCAG 2.1 Contrast

FDC2E2	EECCE4	DFD5E5	D0DEE6	C0E7E7
—	1.0 Fail	1.1 Fail	1.1 Fail	1.1 Fail
1.0 Fail	—	1.0 Fail	1.1 Fail	1.1 Fail
1.1 Fail	1.0 Fail	—	1.0 Fail	1.1 Fail
1.1 Fail	1.1 Fail	1.0 Fail	—	1.0 Fail
1.1 Fail	1.1 Fail	1.1 Fail	1.0 Fail	—

White BG

1.5Fail

1.4Fail

1.3Fail

Black BG

14.0AAA

14.4AAA

14.8AAA

15.3AAA

15.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E3E3DA

DFDFDE

DBDBE1

D6D6E4

D1D1E7

Deuteranopia

E7EBD8

E1E4DD

DBDCE0

D5D4E4

CFCCE7

Tritanopia

FAD4D3

ECDAD9

DFDEDD

D1E3E2

C2E7E7

Achromatopsia

D7D7D7

D9D9D9

DADADA

DBDBDB

Shades & Tints Shades & Tints

#FDC2E2

Dark

Light

#EECCE4

Dark

Light

#DFD5E5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fdc2e2;
  --color-2: #eecce4;
  --color-3: #dfd5e5;
  --color-4: #d0dee6;
  --color-5: #c0e7e7;
}

SCSS

$color-1: #fdc2e2;
$color-2: #eecce4;
$color-3: #dfd5e5;
$color-4: #d0dee6;
$color-5: #c0e7e7;

TAILWIND

colors: {
  'brand-1': '#fdc2e2',
  'brand-2': '#eecce4',
  'brand-3': '#dfd5e5',
  'brand-4': '#d0dee6',
  'brand-5': '#c0e7e7',
}

RGB Array

[253, 194, 226], [238, 204, 228], [223, 213, 229], [208, 222, 230], [192, 231, 231]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FDC2E2, #EECCE4, #DFD5E5, #D0DEE6, #C0E7E7 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: #fdc2e2; --color-2: #eecce4; --color-3: #dfd5e5; --color-4: #d0dee6; --color-5: #c0e7e7. 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