#F0C6BB + #DCC4B3 + #CBB7BE + #BAABD0 + #DB8BF8 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F0C6BB

Peach Pink · Pink · Cherry Blossom

HEX

#F0C6BB

RGB

rgb(240, 198, 187)

HSL

hsl(12, 64%, 84%)

HSB

hsb(12, 22%, 94%)

CMYK

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

Oklch

oklch(86.0% 0.050 35.1)

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

#DCC4B3

Apricot · Silver · Peach Orange

HEX

#DCC4B3

RGB

rgb(220, 196, 179)

HSL

hsl(25, 37%, 78%)

HSB

hsb(25, 19%, 86%)

CMYK

cmyk(0%, 11%, 19%, 14%)

Oklch

oklch(83.6% 0.036 57.5)

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

#CBB7BE

Rouge · Silver · Cherry Blossom

HEX

#CBB7BE

RGB

rgb(203, 183, 190)

HSL

hsl(339, 16%, 76%)

HSB

hsb(339, 10%, 80%)

CMYK

cmyk(0%, 10%, 6%, 20%)

Oklch

oklch(79.8% 0.025 354.4)

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

#BAABD0

Wisteria · Silver · Lilac Purple

HEX

#BAABD0

RGB

rgb(186, 171, 208)

HSL

hsl(264, 28%, 74%)

HSB

hsb(264, 18%, 82%)

CMYK

cmyk(11%, 18%, 0%, 18%)

Oklch

oklch(76.6% 0.055 303.6)

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

#DB8BF8

Lilac · Violet · Lilac Purple

HEX

#DB8BF8

RGB

rgb(219, 139, 248)

HSL

hsl(284, 89%, 76%)

HSB

hsb(284, 44%, 97%)

CMYK

cmyk(12%, 44%, 0%, 3%)

Oklch

oklch(75.8% 0.171 316.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0C6BB

BCE6F0

Analogous

F0BCCC

F0C6BB

F0E1BC

Triadic

F0C6BB

BCF0C7

C7BCF0

Split-Comp.

F0C6BB

BCF0E1

BCCCF0

Tetradic

F0C6BB

CCF0BC

BCE6F0

E1BCF0

Contrast Matrix WCAG 2.1 Contrast

F0C6BB	DCC4B3	CBB7BE	BAABD0	DB8BF8
—	1.1 Fail	1.2 Fail	1.4 Fail	1.5 Fail
1.1 Fail	—	1.1 Fail	1.3 Fail	1.4 Fail
1.2 Fail	1.1 Fail	—	1.1 Fail	1.2 Fail
1.4 Fail	1.3 Fail	1.1 Fail	—	1.1 Fail
1.5 Fail	1.4 Fail	1.2 Fail	1.1 Fail	—

White BG

1.6Fail

1.7Fail

1.9Fail

2.1Fail

2.3Fail

Black BG

13.5AAA

12.6AAA

11.1AAA

9.8AAA

9.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDDBE

D2D1B7

C2C2BC

B4B3C7

B8B8DE

Deuteranopia

E0E3BE

D3D5B8

C4C5BC

B4B6C5

BDC3D7

Tritanopia

EEC0C0

DBBABB

CABBBB

B9C0BE

D7C9C4

Achromatopsia

D1D1D1

C9C9C9

BEBEBE

B4B4B4

AFAFAF

Shades & Tints Shades & Tints

#F0C6BB

Dark

Light

#DCC4B3

Dark

Light

#CBB7BE

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0c6bb;
  --color-2: #dcc4b3;
  --color-3: #cbb7be;
  --color-4: #baabd0;
  --color-5: #db8bf8;
}

SCSS

$color-1: #f0c6bb;
$color-2: #dcc4b3;
$color-3: #cbb7be;
$color-4: #baabd0;
$color-5: #db8bf8;

TAILWIND

colors: {
  'brand-1': '#f0c6bb',
  'brand-2': '#dcc4b3',
  'brand-3': '#cbb7be',
  'brand-4': '#baabd0',
  'brand-5': '#db8bf8',
}

RGB Array

[240, 198, 187], [220, 196, 179], [203, 183, 190], [186, 171, 208], [219, 139, 248]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F0C6BB, #DCC4B3, #CBB7BE, #BAABD0, #DB8BF8 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: #f0c6bb; --color-2: #dcc4b3; --color-3: #cbb7be; --color-4: #baabd0; --color-5: #db8bf8. 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