← Back to Editor

#4B464A · #D1A5B4 · #D3B9C4 · #DBD0D4 · #B9B8B3

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

WorkspaceReadingData Visualization

Color Details Color Details

#4B464A

Dark Cyan · DarkSlateGray · Charcoal

HEX
#4B464A
RGB
rgb(75, 70, 74)
HSL
hsl(312, 3%, 28%)
HSB
hsb(312, 7%, 29%)
CMYK
cmyk(0%, 7%, 1%, 71%)
Oklch
oklch(40.1% 0.009 332.3)

Traditional「Dark Cyan」· Paint「Charcoal」· Creative Midnight Shadow

#D1A5B4

Rouge · Silver · Rose Pink

HEX
#D1A5B4
RGB
rgb(209, 165, 180)
HSL
hsl(340, 32%, 73%)
HSB
hsb(340, 21%, 82%)
CMYK
cmyk(0%, 21%, 14%, 18%)
Oklch
oklch(76.6% 0.055 356.1)

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

#D3B9C4

Rouge · Silver · Cherry Blossom

HEX
#D3B9C4
RGB
rgb(211, 185, 196)
HSL
hsl(335, 23%, 78%)
HSB
hsb(335, 12%, 83%)
CMYK
cmyk(0%, 12%, 7%, 17%)
Oklch
oklch(81.1% 0.033 350.4)

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

#DBD0D4

Rouge · LightGray · Cherry Blossom

HEX
#DBD0D4
RGB
rgb(219, 208, 212)
HSL
hsl(338, 13%, 84%)
HSB
hsb(338, 5%, 86%)
CMYK
cmyk(0%, 5%, 3%, 14%)
Oklch
oklch(86.8% 0.013 353.2)

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

#B9B8B3

Silver Gray · Silver · Pearl Gray

HEX
#B9B8B3
RGB
rgb(185, 184, 179)
HSL
hsl(50, 4%, 71%)
HSB
hsb(50, 3%, 73%)
CMYK
cmyk(0%, 1%, 3%, 27%)
Oklch
oklch(78.2% 0.007 97.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4B464A
454A46

Analogous

48454A
4B464A
4A4547

Triadic

4B464A
494A45
45494A

Split-Comp.

4B464A
474A45
454A48

Tetradic

4B464A
4A4845
454A46
45474A

Contrast Matrix WCAG 2.1 Contrast

4B464A
D1A5B4
D3B9C4
DBD0D4
B9B8B3
—
4.3
AA Large
5.1
AA
6.1
AA
4.6
AA
4.3
AA Large
—
1.2
Fail
1.4
Fail
1.1
Fail
5.1
AA
1.2
Fail
—
1.2
Fail
1.1
Fail
6.1
AA
1.4
Fail
1.2
Fail
—
1.3
Fail
4.6
AA
1.1
Fail
1.1
Fail
1.3
Fail
—
White BG
9.2AAA
2.2Fail
1.8Fail
1.5Fail
2.0Fail
Black BG
2.3Fail
9.8AAA
11.5AAA
14.0AAA
10.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

494949
BEBEB0
C8C8C1
D6D6D3
B9B9B4

Deuteranopia

494A49
C1C4B0
C9CBC1
D7D8D3
B9B9B5

Tritanopia

4B4848
CFAEAD
D2BFBF
DAD2D2
B9B5B5

Achromatopsia

484848
B4B4B4
C2C2C2
D4D4D4
B8B8B8

Shades & Tints Shades & Tints

#4B464A

Dark
Light

#D1A5B4

Dark
Light

#D3B9C4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4b464a;
  --color-2: #d1a5b4;
  --color-3: #d3b9c4;
  --color-4: #dbd0d4;
  --color-5: #b9b8b3;
}

SCSS

$color-1: #4b464a;
$color-2: #d1a5b4;
$color-3: #d3b9c4;
$color-4: #dbd0d4;
$color-5: #b9b8b3;

TAILWIND

colors: {
  'brand-1': '#4b464a',
  'brand-2': '#d1a5b4',
  'brand-3': '#d3b9c4',
  'brand-4': '#dbd0d4',
  'brand-5': '#b9b8b3',
}

RGB Array

[75, 70, 74], [209, 165, 180], [211, 185, 196], [219, 208, 212], [185, 184, 179]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4B464A, #D1A5B4, #D3B9C4, #DBD0D4, #B9B8B3 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #4b464a; --color-2: #d1a5b4; --color-3: #d3b9c4; --color-4: #dbd0d4; --color-5: #b9b8b3. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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