← Back to Editor

#BDB8B2 · #BBA5AC · #BA93A6 · #9791A2 · #74909E

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#BDB8B2

Goose Yellow · Silver · Pearl Gray

HEX
#BDB8B2
RGB
rgb(189, 184, 178)
HSL
hsl(33, 8%, 72%)
HSB
hsb(33, 6%, 74%)
CMYK
cmyk(0%, 3%, 6%, 26%)
Oklch
oklch(78.5% 0.010 72.6)

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

#BBA5AC

Rouge · DarkGray · Rose Pink

HEX
#BBA5AC
RGB
rgb(187, 165, 172)
HSL
hsl(341, 14%, 69%)
HSB
hsb(341, 12%, 73%)
CMYK
cmyk(0%, 12%, 8%, 27%)
Oklch
oklch(74.3% 0.027 356.6)

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

#BA93A6

Rouge · DarkGray · Rose Pink

HEX
#BA93A6
RGB
rgb(186, 147, 166)
HSL
hsl(331, 22%, 65%)
HSB
hsb(331, 21%, 73%)
CMYK
cmyk(0%, 21%, 11%, 27%)
Oklch
oklch(70.5% 0.053 347.7)

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

#9791A2

Deep Indigo · DarkGray · Silver Sand

HEX
#9791A2
RGB
rgb(151, 145, 162)
HSL
hsl(261, 8%, 60%)
HSB
hsb(261, 10%, 64%)
CMYK
cmyk(7%, 10%, 0%, 36%)
Oklch
oklch(66.7% 0.026 301.7)

Traditional「Deep Indigo」· Paint「Silver Sand」· Creative Urban Concrete

#74909E

Slate Blue · LightSlateGray · Navy Blue

HEX
#74909E
RGB
rgb(116, 144, 158)
HSL
hsl(200, 18%, 54%)
HSB
hsb(200, 27%, 62%)
CMYK
cmyk(27%, 9%, 0%, 38%)
Oklch
oklch(63.7% 0.038 229.7)

Traditional「Slate Blue」· Paint「Navy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BDB8B2
B2B7BD

Analogous

BDB2B2
BDB8B2
BDBDB2

Triadic

BDB8B2
B2BDB8
B8B2BD

Split-Comp.

BDB8B2
B2BDBD
B2B2BD

Tetradic

BDB8B2
B2BDB2
B2B7BD
BDB2BD

Contrast Matrix WCAG 2.1 Contrast

BDB8B2
BBA5AC
BA93A6
9791A2
74909E
—
1.2
Fail
1.4
Fail
1.5
Fail
1.7
Fail
1.2
Fail
—
1.2
Fail
1.3
Fail
1.5
Fail
1.4
Fail
1.2
Fail
—
1.1
Fail
1.3
Fail
1.5
Fail
1.3
Fail
1.1
Fail
—
1.1
Fail
1.7
Fail
1.5
Fail
1.3
Fail
1.1
Fail
—
White BG
2.0Fail
2.3Fail
2.7Fail
3.0AA Large
3.4AA Large
Black BG
10.7AAA
9.1AAA
7.8AAA
6.9AA
6.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BBBBB3
B1B1AA
A9A9A1
94949E
80809B

Deuteranopia

BBBBB4
B3B4AA
ABAEA0
95959D
7F7C9A

Tritanopia

BDB5B5
BAA9A9
B89E9D
979B9A
759897

Achromatopsia

B9B9B9
ACACAC
A1A1A1
959595
898989

Shades & Tints Shades & Tints

#BDB8B2

Dark
Light

#BBA5AC

Dark
Light

#BA93A6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bdb8b2;
  --color-2: #bba5ac;
  --color-3: #ba93a6;
  --color-4: #9791a2;
  --color-5: #74909e;
}

SCSS

$color-1: #bdb8b2;
$color-2: #bba5ac;
$color-3: #ba93a6;
$color-4: #9791a2;
$color-5: #74909e;

TAILWIND

colors: {
  'brand-1': '#bdb8b2',
  'brand-2': '#bba5ac',
  'brand-3': '#ba93a6',
  'brand-4': '#9791a2',
  'brand-5': '#74909e',
}

RGB Array

[189, 184, 178], [187, 165, 172], [186, 147, 166], [151, 145, 162], [116, 144, 158]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BDB8B2, #BBA5AC, #BA93A6, #9791A2, #74909E is ideal for: brand design, premium product pages, magazine layouts. 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: #bdb8b2; --color-2: #bba5ac; --color-3: #ba93a6; --color-4: #9791a2; --color-5: #74909e. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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. 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