#B5B8B1 + #F5CEC7 + #F9BDBD + #EAAEB0 + #C5A5A6 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B5B8B1

Silver Gray · Silver · Pearl Gray

HEX

#B5B8B1

RGB

rgb(181, 184, 177)

HSL

hsl(86, 5%, 71%)

HSB

hsb(86, 4%, 72%)

CMYK

cmyk(2%, 0%, 4%, 28%)

Oklch

oklch(77.8% 0.010 125.7)

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

#F5CEC7

Peach Pink · Pink · Cherry Blossom

HEX

#F5CEC7

RGB

rgb(245, 206, 199)

HSL

hsl(9, 70%, 87%)

HSB

hsb(9, 19%, 96%)

CMYK

cmyk(0%, 16%, 19%, 4%)

Oklch

oklch(88.3% 0.045 29.9)

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

#F9BDBD

Peach Pink · LightPink · Cherry Blossom

HEX

#F9BDBD

RGB

rgb(249, 189, 189)

HSL

hsl(0, 83%, 86%)

HSB

hsb(0, 24%, 98%)

CMYK

cmyk(0%, 24%, 24%, 2%)

Oklch

oklch(85.3% 0.069 18.6)

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

#EAAEB0

Peach Pink · LightPink · Coral Red

HEX

#EAAEB0

RGB

rgb(234, 174, 176)

HSL

hsl(358, 59%, 80%)

HSB

hsb(358, 26%, 92%)

CMYK

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

Oklch

oklch(80.7% 0.071 16.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#C5A5A6

Peach Pink · DarkGray · Coral Red

HEX

#C5A5A6

RGB

rgb(197, 165, 166)

HSL

hsl(358, 22%, 71%)

HSB

hsb(358, 16%, 77%)

CMYK

cmyk(0%, 16%, 16%, 23%)

Oklch

oklch(75.1% 0.038 15.9)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B5B8B1

B5B1B9

Analogous

B9B8B1

B5B8B1

B2B9B1

Triadic

B5B8B1

B1B6B9

B9B1B6

Split-Comp.

B5B8B1

B1B2B9

B8B1B9

Tetradic

B5B8B1

B1B9B8

B5B1B9

B9B1B2

Contrast Matrix WCAG 2.1 Contrast

B5B8B1	F5CEC7	F9BDBD	EAAEB0	C5A5A6
—	1.4 Fail	1.2 Fail	1.1 Fail	1.1 Fail
1.4 Fail	—	1.1 Fail	1.3 Fail	1.6 Fail
1.2 Fail	1.1 Fail	—	1.2 Fail	1.4 Fail
1.1 Fail	1.3 Fail	1.2 Fail	—	1.2 Fail
1.1 Fail	1.6 Fail	1.4 Fail	1.2 Fail	—

White BG

2.0Fail

1.4Fail

1.6Fail

1.9Fail

2.3Fail

Black BG

10.5AAA

14.5AAA

13.0AAA

11.2AAA

9.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B6B6B3

E4E4C9

DFDEBD

D0CFB0

B7B7A6

Deuteranopia

B6B6B3

E6E9C9

E3E7BD

D4D8AF

B9BBA6

Tritanopia

B5B4B4

F3CACA

F6BDBD

E7AFAF

C3A6A6

Achromatopsia

B6B6B6

D9D9D9

CFCFCF

C0C0C0

AFAFAF

Shades & Tints Shades & Tints

#B5B8B1

Dark

Light

#F5CEC7

Dark

Light

#F9BDBD

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b5b8b1;
  --color-2: #f5cec7;
  --color-3: #f9bdbd;
  --color-4: #eaaeb0;
  --color-5: #c5a5a6;
}

SCSS

$color-1: #b5b8b1;
$color-2: #f5cec7;
$color-3: #f9bdbd;
$color-4: #eaaeb0;
$color-5: #c5a5a6;

TAILWIND

colors: {
  'brand-1': '#b5b8b1',
  'brand-2': '#f5cec7',
  'brand-3': '#f9bdbd',
  'brand-4': '#eaaeb0',
  'brand-5': '#c5a5a6',
}

RGB Array

[181, 184, 177], [245, 206, 199], [249, 189, 189], [234, 174, 176], [197, 165, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B5B8B1, #F5CEC7, #F9BDBD, #EAAEB0, #C5A5A6 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: #b5b8b1; --color-2: #f5cec7; --color-3: #f9bdbd; --color-4: #eaaeb0; --color-5: #c5a5a6. 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