#F0C6B0 + #E2CCB7 + #B4D8D6 + #D6CCC0 + #B7D4D2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F0C6B0

Apricot · Wheat · Peach Orange

HEX

#F0C6B0

RGB

rgb(240, 198, 176)

HSL

hsl(21, 68%, 82%)

HSB

hsb(21, 27%, 94%)

CMYK

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

Oklch

oklch(85.7% 0.057 49.2)

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

#E2CCB7

Apricot · Wheat · Peach Orange

HEX

#E2CCB7

RGB

rgb(226, 204, 183)

HSL

hsl(29, 43%, 80%)

HSB

hsb(29, 19%, 89%)

CMYK

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

Oklch

oklch(85.8% 0.038 66.0)

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

#B4D8D6

Jade · LightBlue · Glacier Blue

HEX

#B4D8D6

RGB

rgb(180, 216, 214)

HSL

hsl(177, 32%, 78%)

HSB

hsb(177, 17%, 85%)

CMYK

cmyk(17%, 0%, 1%, 15%)

Oklch

oklch(85.6% 0.038 192.3)

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

#D6CCC0

Goose Yellow · LightGray · Peach Orange

HEX

#D6CCC0

RGB

rgb(214, 204, 192)

HSL

hsl(33, 21%, 80%)

HSB

hsb(33, 10%, 84%)

CMYK

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

Oklch

oklch(85.0% 0.020 72.5)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#B7D4D2

Jade · LightSteelBlue · Glacier Blue

HEX

#B7D4D2

RGB

rgb(183, 212, 210)

HSL

hsl(176, 25%, 77%)

HSB

hsb(176, 14%, 83%)

CMYK

cmyk(14%, 0%, 1%, 17%)

Oklch

oklch(84.8% 0.031 191.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0C6B0

B2DAF0

Analogous

F0B2BB

F0C6B0

F0E7B2

Triadic

F0C6B0

B2F0C8

C8B2F0

Split-Comp.

F0C6B0

B2F0E7

B2BBF0

Tetradic

F0C6B0

BBF0B2

B2DAF0

E7B2F0

Contrast Matrix WCAG 2.1 Contrast

F0C6B0	E2CCB7	B4D8D6	D6CCC0	B7D4D2
—	1.0 Fail	1.0 Fail	1.0 Fail	1.0 Fail
1.0 Fail	—	1.0 Fail	1.0 Fail	1.0 Fail
1.0 Fail	1.0 Fail	—	1.0 Fail	1.0 Fail
1.0 Fail	1.0 Fail	1.0 Fail	—	1.0 Fail
1.0 Fail	1.0 Fail	1.0 Fail	1.0 Fail	—

White BG

1.6Fail

1.5Fail

1.6Fail

Black BG

13.4AAA

13.6AAA

13.7AAA

13.3AAA

13.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDDB5

D8D8BC

C4C4D6

D2D2C3

C4C4D2

Deuteranopia

E0E3B7

DADBBD

C2BFD7

D2D3C4

C2C0D3

Tritanopia

EEBABA

E1C0C1

B6D7D7

D5C5C6

B8D3D3

Achromatopsia

D0D0D0

CDCDCD

CECECE

CBCBCB

Shades & Tints Shades & Tints

#F0C6B0

Dark

Light

#E2CCB7

Dark

Light

#B4D8D6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0c6b0;
  --color-2: #e2ccb7;
  --color-3: #b4d8d6;
  --color-4: #d6ccc0;
  --color-5: #b7d4d2;
}

SCSS

$color-1: #f0c6b0;
$color-2: #e2ccb7;
$color-3: #b4d8d6;
$color-4: #d6ccc0;
$color-5: #b7d4d2;

TAILWIND

colors: {
  'brand-1': '#f0c6b0',
  'brand-2': '#e2ccb7',
  'brand-3': '#b4d8d6',
  'brand-4': '#d6ccc0',
  'brand-5': '#b7d4d2',
}

RGB Array

[240, 198, 176], [226, 204, 183], [180, 216, 214], [214, 204, 192], [183, 212, 210]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F0C6B0, #E2CCB7, #B4D8D6, #D6CCC0, #B7D4D2 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: #f0c6b0; --color-2: #e2ccb7; --color-3: #b4d8d6; --color-4: #d6ccc0; --color-5: #b7d4d2. 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