← Back to Editor

#C4B5BC · #ABA2A7 · #B9BFB8 · #F2C7C8 · #F9FCF7

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C4B5BC

Rouge · Silver · Rose Pink

HEX
#C4B5BC
RGB
rgb(196, 181, 188)
HSL
hsl(332, 11%, 74%)
HSB
hsb(332, 8%, 77%)
CMYK
cmyk(0%, 8%, 4%, 23%)
Oklch
oklch(78.8% 0.020 347.6)

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

#ABA2A7

Ash · DarkGray · Silver Sand

HEX
#ABA2A7
RGB
rgb(171, 162, 167)
HSL
hsl(327, 5%, 65%)
HSB
hsb(327, 5%, 67%)
CMYK
cmyk(0%, 5%, 2%, 33%)
Oklch
oklch(72.1% 0.013 342.8)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#B9BFB8

Silver Gray · Silver · Pearl Gray

HEX
#B9BFB8
RGB
rgb(185, 191, 184)
HSL
hsl(111, 5%, 74%)
HSB
hsb(111, 4%, 75%)
CMYK
cmyk(3%, 0%, 4%, 25%)
Oklch
oklch(79.8% 0.012 141.3)

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

#F2C7C8

Peach Pink · Pink · Cherry Blossom

HEX
#F2C7C8
RGB
rgb(242, 199, 200)
HSL
hsl(359, 62%, 86%)
HSB
hsb(359, 18%, 95%)
CMYK
cmyk(0%, 18%, 17%, 5%)
Oklch
oklch(86.7% 0.049 16.6)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#F9FCF7

Celadon · Snow · Mint Green

HEX
#F9FCF7
RGB
rgb(249, 252, 247)
HSL
hsl(96, 45%, 98%)
HSB
hsb(96, 2%, 99%)
CMYK
cmyk(1%, 0%, 2%, 1%)
Oklch
oklch(98.7% 0.007 132.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C4B5BC
B5C4BD

Analogous

C4B5C4
C4B5BC
C4B6B5

Triadic

C4B5BC
BCC4B5
B5BCC4

Split-Comp.

C4B5BC
B5C4B6
B5C4C4

Tetradic

C4B5BC
C4C4B5
B5C4BD
B6B5C4

Contrast Matrix WCAG 2.1 Contrast

C4B5BC
ABA2A7
B9BFB8
F2C7C8
F9FCF7
—
1.3
Fail
1.0
Fail
1.3
Fail
1.9
Fail
1.3
Fail
—
1.3
Fail
1.6
Fail
2.4
Fail
1.0
Fail
1.3
Fail
—
1.2
Fail
1.8
Fail
1.3
Fail
1.6
Fail
1.2
Fail
—
1.5
Fail
1.9
Fail
2.4
Fail
1.8
Fail
1.5
Fail
—
White BG
2.0Fail
2.5Fail
1.9Fail
1.5Fail
1.0Fail
Black BG
10.7AAA
8.5AAA
11.2AAA
13.8AAA
20.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BEBDBA
A7A7A6
BCBCBA
DFDFC8
FAFAF8

Deuteranopia

BEC0BA
A8A8A6
BBBBBA
E2E5C8
FAFAF8

Tritanopia

C3B9B9
ABA5A5
B9BBBB
F0C8C8
F9F9F9

Achromatopsia

BABABA
A5A5A5
BCBCBC
D4D4D4
FBFBFB

Shades & Tints Shades & Tints

#C4B5BC

Dark
Light

#ABA2A7

Dark
Light

#B9BFB8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c4b5bc;
  --color-2: #aba2a7;
  --color-3: #b9bfb8;
  --color-4: #f2c7c8;
  --color-5: #f9fcf7;
}

SCSS

$color-1: #c4b5bc;
$color-2: #aba2a7;
$color-3: #b9bfb8;
$color-4: #f2c7c8;
$color-5: #f9fcf7;

TAILWIND

colors: {
  'brand-1': '#c4b5bc',
  'brand-2': '#aba2a7',
  'brand-3': '#b9bfb8',
  'brand-4': '#f2c7c8',
  'brand-5': '#f9fcf7',
}

RGB Array

[196, 181, 188], [171, 162, 167], [185, 191, 184], [242, 199, 200], [249, 252, 247]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C4B5BC, #ABA2A7, #B9BFB8, #F2C7C8, #F9FCF7 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #c4b5bc; --color-2: #aba2a7; --color-3: #b9bfb8; --color-4: #f2c7c8; --color-5: #f9fcf7. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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