#FE2251 + #E5D3DC + #ECE1C7 + #C9E3F1 + #D4CDCD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FE2251

Vermilion · Crimson · Passion Red

HEX

#FE2251

RGB

rgb(254, 34, 81)

HSL

hsl(347, 99%, 56%)

HSB

hsb(347, 87%, 100%)

CMYK

cmyk(0%, 87%, 68%, 0%)

Oklch

oklch(64.2% 0.243 18.0)

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

#E5D3DC

Rouge · LightGray · Cherry Blossom

HEX

#E5D3DC

RGB

rgb(229, 211, 220)

HSL

hsl(330, 26%, 86%)

HSB

hsb(330, 8%, 90%)

CMYK

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

Oklch

oklch(88.4% 0.023 345.8)

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

#ECE1C7

Goose Yellow · Bisque · Lemon Cream

HEX

#ECE1C7

RGB

rgb(236, 225, 199)

HSL

hsl(42, 49%, 85%)

HSB

hsb(42, 16%, 93%)

CMYK

cmyk(0%, 5%, 16%, 7%)

Oklch

oklch(91.2% 0.037 87.8)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#C9E3F1

Sky Blue · Lavender · Sky Blue

HEX

#C9E3F1

RGB

rgb(201, 227, 241)

HSL

hsl(201, 59%, 87%)

HSB

hsb(201, 17%, 95%)

CMYK

cmyk(17%, 6%, 0%, 5%)

Oklch

oklch(90.1% 0.034 231.2)

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

#D4CDCD

Peach Pink · LightGray · Pearl Gray

HEX

#D4CDCD

RGB

rgb(212, 205, 205)

HSL

hsl(0, 8%, 82%)

HSB

hsb(0, 3%, 83%)

CMYK

cmyk(0%, 3%, 3%, 17%)

Oklch

oklch(85.4% 0.008 17.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FE2251

20FECE

Analogous

FE20BF

FE2251

FE5F20

Triadic

FE2251

50FE20

2050FE

Split-Comp.

FE2251

20FE5F

20BFFE

Tetradic

FE2251

BFFE20

20FECE

5F20FE

Contrast Matrix WCAG 2.1 Contrast

FE2251	E5D3DC	ECE1C7	C9E3F1	D4CDCD
—	2.6 Fail	2.9 Fail	2.8 Fail	2.4 Fail
2.6 Fail	—	1.1 Fail	1.1 Fail	1.1 Fail
2.9 Fail	1.1 Fail	—	1.0 Fail	1.2 Fail
2.8 Fail	1.1 Fail	1.0 Fail	—	1.2 Fail
2.4 Fail	1.1 Fail	1.2 Fail	1.2 Fail	—

White BG

3.8AA Large

1.4Fail

1.3Fail

1.6Fail

Black BG

5.6AA

14.7AAA

16.2AAA

15.7AAA

13.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9F9D46

DDDDDA

E7E7CD

D4D4EE

D1D1CD

Deuteranopia

ACBC43

DEE0D9

E8E9CF

D3D1ED

D1D2CD

Tritanopia

F33D3B

E4D8D8

EBD2D3

CAEBEA

D4CDCD

Achromatopsia

696969

D9D9D9

E1E1E1

DDDDDD

CFCFCF

Shades & Tints Shades & Tints

#FE2251

Dark

Light

#E5D3DC

Dark

Light

#ECE1C7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fe2251;
  --color-2: #e5d3dc;
  --color-3: #ece1c7;
  --color-4: #c9e3f1;
  --color-5: #d4cdcd;
}

SCSS

$color-1: #fe2251;
$color-2: #e5d3dc;
$color-3: #ece1c7;
$color-4: #c9e3f1;
$color-5: #d4cdcd;

TAILWIND

colors: {
  'brand-1': '#fe2251',
  'brand-2': '#e5d3dc',
  'brand-3': '#ece1c7',
  'brand-4': '#c9e3f1',
  'brand-5': '#d4cdcd',
}

RGB Array

[254, 34, 81], [229, 211, 220], [236, 225, 199], [201, 227, 241], [212, 205, 205]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FE2251, #E5D3DC, #ECE1C7, #C9E3F1, #D4CDCD 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: #fe2251; --color-2: #e5d3dc; --color-3: #ece1c7; --color-4: #c9e3f1; --color-5: #d4cdcd. 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