← Back to Editor

#B8B6AA · #DBD7B2 · #A8828F · #B3A5A2 · #6A5672

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B8B6AA

Fresh Green · DarkGray · Silver Sand

HEX
#B8B6AA
RGB
rgb(184, 182, 170)
HSL
hsl(51, 9%, 69%)
HSB
hsb(51, 8%, 72%)
CMYK
cmyk(0%, 1%, 8%, 28%)
Oklch
oklch(77.4% 0.017 99.1)

Traditional「Fresh Green」· Paint「Silver Sand」· Creative Urban Concrete

#DBD7B2

Fresh Green · Wheat · Lemon Cream

HEX
#DBD7B2
RGB
rgb(219, 215, 178)
HSL
hsl(54, 36%, 78%)
HSB
hsb(54, 19%, 86%)
CMYK
cmyk(0%, 2%, 19%, 14%)
Oklch
oklch(87.3% 0.049 102.3)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#A8828F

Dark Violet · Gray · Rose Pink

HEX
#A8828F
RGB
rgb(168, 130, 143)
HSL
hsl(339, 18%, 58%)
HSB
hsb(339, 23%, 66%)
CMYK
cmyk(0%, 23%, 15%, 34%)
Oklch
oklch(64.7% 0.050 356.2)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#B3A5A2

Peach Pink · DarkGray · Coral Red

HEX
#B3A5A2
RGB
rgb(179, 165, 162)
HSL
hsl(11, 10%, 67%)
HSB
hsb(11, 9%, 70%)
CMYK
cmyk(0%, 8%, 9%, 30%)
Oklch
oklch(73.3% 0.017 32.0)

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

#6A5672

Dark Plum · DimGray · Eggplant

HEX
#6A5672
RGB
rgb(106, 86, 114)
HSL
hsl(283, 14%, 39%)
HSB
hsb(283, 25%, 45%)
CMYK
cmyk(7%, 25%, 0%, 55%)
Oklch
oklch(48.4% 0.050 316.2)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B8B6AA
A9ABB7

Analogous

B7AEA9
B8B6AA
B2B7A9

Triadic

B8B6AA
A9B7B5
B5A9B7

Split-Comp.

B8B6AA
A9B2B7
AEA9B7

Tetradic

B8B6AA
A9B7AE
A9ABB7
B7A9B2

Contrast Matrix WCAG 2.1 Contrast

B8B6AA
DBD7B2
A8828F
B3A5A2
6A5672
—
1.4
Fail
1.6
Fail
1.2
Fail
3.2
AA Large
1.4
Fail
—
2.3
Fail
1.6
Fail
4.5
AA
1.6
Fail
2.3
Fail
—
1.4
Fail
2.0
Fail
1.2
Fail
1.6
Fail
1.4
Fail
—
2.8
Fail
3.2
AA Large
4.5
AA
2.0
Fail
2.8
Fail
—
White BG
2.0Fail
1.5Fail
3.4AA Large
2.4Fail
6.6AA
Black BG
10.3AAA
14.4AAA
6.3AA
8.8AAA
3.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

B7B7AD
D9D9BB
98978C
ADADA3
61616B

Deuteranopia

B7B7AE
DADABD
9A9D8B
AEAFA3
63646A

Tritanopia

B8AFB0
DBC2C4
A68989
B2A3A3
696665

Achromatopsia

B5B5B5
D4D4D4
8F8F8F
A9A9A9
5F5F5F

Shades & Tints Shades & Tints

#B8B6AA

Dark
Light

#DBD7B2

Dark
Light

#A8828F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b8b6aa;
  --color-2: #dbd7b2;
  --color-3: #a8828f;
  --color-4: #b3a5a2;
  --color-5: #6a5672;
}

SCSS

$color-1: #b8b6aa;
$color-2: #dbd7b2;
$color-3: #a8828f;
$color-4: #b3a5a2;
$color-5: #6a5672;

TAILWIND

colors: {
  'brand-1': '#b8b6aa',
  'brand-2': '#dbd7b2',
  'brand-3': '#a8828f',
  'brand-4': '#b3a5a2',
  'brand-5': '#6a5672',
}

RGB Array

[184, 182, 170], [219, 215, 178], [168, 130, 143], [179, 165, 162], [106, 86, 114]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B8B6AA, #DBD7B2, #A8828F, #B3A5A2, #6A5672 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: #b8b6aa; --color-2: #dbd7b2; --color-3: #a8828f; --color-4: #b3a5a2; --color-5: #6a5672. 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