#FEBBBE + #ECC4C6 + #DCCECF + #C6DCD4 + #B5E1DD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FEBBBE

Peach Pink · LightPink · Cherry Blossom

HEX

#FEBBBE

RGB

rgb(254, 187, 190)

HSL

hsl(357, 97%, 86%)

HSB

hsb(357, 26%, 100%)

CMYK

cmyk(0%, 26%, 25%, 0%)

Oklch

oklch(85.4% 0.078 15.8)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#ECC4C6

Peach Pink · Pink · Cherry Blossom

HEX

#ECC4C6

RGB

rgb(236, 196, 198)

HSL

hsl(357, 51%, 85%)

HSB

hsb(357, 17%, 93%)

CMYK

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

Oklch

oklch(85.5% 0.046 14.7)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#DCCECF

Peach Pink · LightGray · Cherry Blossom

HEX

#DCCECF

RGB

rgb(220, 206, 207)

HSL

hsl(356, 17%, 84%)

HSB

hsb(356, 6%, 86%)

CMYK

cmyk(0%, 6%, 6%, 14%)

Oklch

oklch(86.3% 0.016 12.5)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#C6DCD4

Jade · LightGray · Mint Green

HEX

#C6DCD4

RGB

rgb(198, 220, 212)

HSL

hsl(158, 24%, 82%)

HSB

hsb(158, 10%, 86%)

CMYK

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

Oklch

oklch(87.6% 0.026 171.9)

Traditional「Jade」· Paint「Mint Green」· Creative Arctic Pool

#B5E1DD

Jade · LightBlue · Glacier Blue

HEX

#B5E1DD

RGB

rgb(181, 225, 221)

HSL

hsl(175, 42%, 80%)

HSB

hsb(175, 20%, 88%)

CMYK

cmyk(20%, 0%, 2%, 12%)

Oklch

oklch(87.8% 0.046 189.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FEBBBE

B9FEFA

Analogous

FEB9DF

FEBBBE

FED8B9

Triadic

FEBBBE

BCFEB9

B9BCFE

Split-Comp.

FEBBBE

B9FED8

B9DFFE

Tetradic

FEBBBE

DFFEB9

B9FEFA

D8B9FE

Contrast Matrix WCAG 2.1 Contrast

FEBBBE	ECC4C6	DCCECF	C6DCD4	B5E1DD
—	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.1 Fail	1.1 Fail
1.1 Fail	1.1 Fail	1.1 Fail	—	1.0 Fail
1.1 Fail	1.1 Fail	1.1 Fail	1.0 Fail	—

White BG

1.6Fail

1.5Fail

1.4Fail

Black BG

13.1AAA

13.3AAA

13.8AAA

14.6AAA

14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E1E0BD

DBDAC6

D6D6CF

D0D0D6

C8C8DE

Deuteranopia

E5EABD

DDE0C5

D7D8CF

CECDD6

C6C2DE

Tritanopia

FBBDBD

EAC5C5

DBCFCF

C7D7D8

B7DFDF

Achromatopsia

CFCFCF

D0D0D0

D2D2D2

D5D5D5

D3D3D3

Shades & Tints Shades & Tints

#FEBBBE

Dark

Light

#ECC4C6

Dark

Light

#DCCECF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #febbbe;
  --color-2: #ecc4c6;
  --color-3: #dccecf;
  --color-4: #c6dcd4;
  --color-5: #b5e1dd;
}

SCSS

$color-1: #febbbe;
$color-2: #ecc4c6;
$color-3: #dccecf;
$color-4: #c6dcd4;
$color-5: #b5e1dd;

TAILWIND

colors: {
  'brand-1': '#febbbe',
  'brand-2': '#ecc4c6',
  'brand-3': '#dccecf',
  'brand-4': '#c6dcd4',
  'brand-5': '#b5e1dd',
}

RGB Array

[254, 187, 190], [236, 196, 198], [220, 206, 207], [198, 220, 212], [181, 225, 221]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FEBBBE, #ECC4C6, #DCCECF, #C6DCD4, #B5E1DD 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: #febbbe; --color-2: #ecc4c6; --color-3: #dccecf; --color-4: #c6dcd4; --color-5: #b5e1dd. 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