#CEDFD5 + #FBE9DF + #EFC9BE + #D2A6B5 + #BA5E87 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#CEDFD5

Celadon · LightGray · Mint Green

HEX

#CEDFD5

RGB

rgb(206, 223, 213)

HSL

hsl(145, 21%, 84%)

HSB

hsb(145, 8%, 87%)

CMYK

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

Oklch

oklch(88.8% 0.023 160.2)

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

#FBE9DF

Apricot · Linen · Peach Orange

HEX

#FBE9DF

RGB

rgb(251, 233, 223)

HSL

hsl(21, 78%, 93%)

HSB

hsb(21, 11%, 98%)

CMYK

cmyk(0%, 7%, 11%, 2%)

Oklch

oklch(94.6% 0.024 51.2)

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

#EFC9BE

Peach Pink · Pink · Cherry Blossom

HEX

#EFC9BE

RGB

rgb(239, 201, 190)

HSL

hsl(13, 60%, 84%)

HSB

hsb(13, 21%, 94%)

CMYK

cmyk(0%, 16%, 21%, 6%)

Oklch

oklch(86.6% 0.046 36.7)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#D2A6B5

Rouge · Silver · Rose Pink

HEX

#D2A6B5

RGB

rgb(210, 166, 181)

HSL

hsl(340, 33%, 74%)

HSB

hsb(340, 21%, 82%)

CMYK

cmyk(0%, 21%, 14%, 18%)

Oklch

oklch(76.9% 0.055 356.1)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#BA5E87

Dark Violet · LightCoral · Rose Pink

HEX

#BA5E87

RGB

rgb(186, 94, 135)

HSL

hsl(333, 40%, 55%)

HSB

hsb(333, 49%, 73%)

CMYK

cmyk(0%, 49%, 27%, 27%)

Oklch

oklch(60.3% 0.127 353.5)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CEDFD5

DFCED8

Analogous

CFDFCE

CEDFD5

CEDFDD

Triadic

CEDFD5

D5CEDF

DFD5CE

Split-Comp.

CEDFD5

DDCEDF

DFCECF

Tetradic

CEDFD5

CECFDF

DFCED8

DFDDCE

Contrast Matrix WCAG 2.1 Contrast

CEDFD5	FBE9DF	EFC9BE	D2A6B5	BA5E87
—	1.2 Fail	1.1 Fail	1.5 Fail	3.0 AA Large
1.2 Fail	—	1.3 Fail	1.8 Fail	3.5 AA Large
1.1 Fail	1.3 Fail	—	1.4 Fail	2.7 Fail
1.5 Fail	1.8 Fail	1.4 Fail	—	2.0 Fail
3.0 AA Large	3.5 AA Large	2.7 Fail	2.0 Fail	—

White BG

1.4Fail

1.2Fail

1.5Fail

2.1Fail

4.2AA Large

Black BG

15.1AAA

17.8AAA

13.8AAA

9.9AAA

5.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D5D6D7

F3F3E1

DFDEC1

BFBFB1

92917D

Deuteranopia

D4D3D8

F4F6E2

E1E4C1

C2C5B1

989E7B

Tritanopia

CFD9DA

FAE3E4

EDC3C3

D0AFAE

B57574

Achromatopsia

D9D9D9

EDEDED

D3D3D3

B5B5B5

7E7E7E

Shades & Tints Shades & Tints

#CEDFD5

Dark

Light

#FBE9DF

Dark

Light

#EFC9BE

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cedfd5;
  --color-2: #fbe9df;
  --color-3: #efc9be;
  --color-4: #d2a6b5;
  --color-5: #ba5e87;
}

SCSS

$color-1: #cedfd5;
$color-2: #fbe9df;
$color-3: #efc9be;
$color-4: #d2a6b5;
$color-5: #ba5e87;

TAILWIND

colors: {
  'brand-1': '#cedfd5',
  'brand-2': '#fbe9df',
  'brand-3': '#efc9be',
  'brand-4': '#d2a6b5',
  'brand-5': '#ba5e87',
}

RGB Array

[206, 223, 213], [251, 233, 223], [239, 201, 190], [210, 166, 181], [186, 94, 135]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CEDFD5, #FBE9DF, #EFC9BE, #D2A6B5, #BA5E87 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: #cedfd5; --color-2: #fbe9df; --color-3: #efc9be; --color-4: #d2a6b5; --color-5: #ba5e87. 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