#BBB6B8 + #F0D9CF + #EFC0B8 + #DBB2AC + #857079 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BBB6B8

Silver Gray · Silver · Pearl Gray

HEX

#BBB6B8

RGB

rgb(187, 182, 184)

HSL

hsl(336, 4%, 72%)

HSB

hsb(336, 3%, 73%)

CMYK

cmyk(0%, 3%, 2%, 27%)

Oklch

oklch(78.1% 0.006 350.9)

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

#F0D9CF

Apricot · Bisque · Peach Orange

HEX

#F0D9CF

RGB

rgb(240, 217, 207)

HSL

hsl(18, 52%, 88%)

HSB

hsb(18, 14%, 94%)

CMYK

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

Oklch

oklch(90.1% 0.029 45.0)

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

#EFC0B8

Peach Pink · LightPink · Cherry Blossom

HEX

#EFC0B8

RGB

rgb(239, 192, 184)

HSL

hsl(9, 63%, 83%)

HSB

hsb(9, 23%, 94%)

CMYK

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

Oklch

oklch(84.7% 0.055 29.4)

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

#DBB2AC

Peach Pink · Tan · Coral Red

HEX

#DBB2AC

RGB

rgb(219, 178, 172)

HSL

hsl(8, 39%, 77%)

HSB

hsb(8, 21%, 86%)

CMYK

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

Oklch

oklch(79.8% 0.049 27.9)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#857079

Dark Violet · Gray · Warm Gray

HEX

#857079

RGB

rgb(133, 112, 121)

HSL

hsl(334, 9%, 48%)

HSB

hsb(334, 16%, 52%)

CMYK

cmyk(0%, 16%, 9%, 48%)

Oklch

oklch(56.8% 0.029 350.4)

Traditional「Dark Violet」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BBB6B8

B5BAB8

Analogous

BAB5BA

BBB6B8

BAB5B5

Triadic

BBB6B8

B7BAB5

B5B7BA

Split-Comp.

BBB6B8

B5BAB5

B5BABA

Tetradic

BBB6B8

BABAB5

B5BAB8

B5B5BA

Contrast Matrix WCAG 2.1 Contrast

BBB6B8	F0D9CF	EFC0B8	DBB2AC	857079
—	1.5 Fail	1.2 Fail	1.0 Fail	2.3 Fail
1.5 Fail	—	1.2 Fail	1.4 Fail	3.4 AA Large
1.2 Fail	1.2 Fail	—	1.2 Fail	2.8 Fail
1.0 Fail	1.4 Fail	1.2 Fail	—	2.4 Fail
2.3 Fail	3.4 AA Large	2.8 Fail	2.4 Fail	—

White BG

2.0Fail

1.4Fail

1.6Fail

1.9Fail

4.6AA

Black BG

10.5AAA

15.5AAA

12.9AAA

11.0AAA

4.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B9B9B8

E6E6D1

DBDABA

C9C9AD

7C7C77

Deuteranopia

B9BAB7

E7E9D2

DDE1BA

CCCFAE

7D7F76

Tritanopia

BBB7B7

EFD3D4

EDBBBC

D9AFAF

847575

Achromatopsia

B8B8B8

DFDFDF

CDCDCD

BEBEBE

777777

Shades & Tints Shades & Tints

#BBB6B8

Dark

Light

#F0D9CF

Dark

Light

#EFC0B8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bbb6b8;
  --color-2: #f0d9cf;
  --color-3: #efc0b8;
  --color-4: #dbb2ac;
  --color-5: #857079;
}

SCSS

$color-1: #bbb6b8;
$color-2: #f0d9cf;
$color-3: #efc0b8;
$color-4: #dbb2ac;
$color-5: #857079;

TAILWIND

colors: {
  'brand-1': '#bbb6b8',
  'brand-2': '#f0d9cf',
  'brand-3': '#efc0b8',
  'brand-4': '#dbb2ac',
  'brand-5': '#857079',
}

RGB Array

[187, 182, 184], [240, 217, 207], [239, 192, 184], [219, 178, 172], [133, 112, 121]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BBB6B8, #F0D9CF, #EFC0B8, #DBB2AC, #857079 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: #bbb6b8; --color-2: #f0d9cf; --color-3: #efc0b8; --color-4: #dbb2ac; --color-5: #857079. 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