← Back to Editor

#B0A7A6 · #AF9DA0 · #B58C9E · #BC7897 · #655C5E

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

#B0A7A6

Ash · DarkGray · Silver Sand

HEX
#B0A7A6
RGB
rgb(176, 167, 166)
HSL
hsl(6, 6%, 67%)
HSB
hsb(6, 6%, 69%)
CMYK
cmyk(0%, 5%, 6%, 31%)
Oklch
oklch(73.6% 0.011 25.1)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#AF9DA0

Peach Pink · DarkGray · Coral Red

HEX
#AF9DA0
RGB
rgb(175, 157, 160)
HSL
hsl(350, 10%, 65%)
HSB
hsb(350, 10%, 69%)
CMYK
cmyk(0%, 10%, 9%, 31%)
Oklch
oklch(71.3% 0.022 6.2)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

#B58C9E

Rouge · DarkGray · Rose Pink

HEX
#B58C9E
RGB
rgb(181, 140, 158)
HSL
hsl(334, 22%, 63%)
HSB
hsb(334, 23%, 71%)
CMYK
cmyk(0%, 23%, 13%, 29%)
Oklch
oklch(68.4% 0.055 350.5)

TraditionalRouge」· PaintRose Pink」· Creative Rose Petal

#BC7897

Dark Violet · DarkGray · Rose Pink

HEX
#BC7897
RGB
rgb(188, 120, 151)
HSL
hsl(333, 34%, 60%)
HSB
hsb(333, 36%, 74%)
CMYK
cmyk(0%, 36%, 20%, 26%)
Oklch
oklch(65.3% 0.094 351.1)

TraditionalDark Violet」· PaintRose Pink」· Creative Blush Sunrise

#655C5E

Ink Gray · DimGray · Charcoal

HEX
#655C5E
RGB
rgb(101, 92, 94)
HSL
hsl(347, 5%, 38%)
HSB
hsb(347, 9%, 40%)
CMYK
cmyk(0%, 9%, 7%, 60%)
Oklch
oklch(48.4% 0.012 2.4)

TraditionalInk Gray」· PaintCharcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B0A7A6
A6AFB0

Analogous

B0A6AA
B0A7A6
B0ACA6

Triadic

B0A7A6
A6B0A7
A7A6B0

Split-Comp.

B0A7A6
A6B0AC
A6AAB0

Tetradic

B0A7A6
AAB0A6
A6AFB0
ACA6B0

Contrast Matrix WCAG 2.1 Contrast

B0A7A6
AF9DA0
B58C9E
BC7897
655C5E
1.1
Fail
1.2
Fail
1.4
Fail
2.7
Fail
1.1
Fail
1.1
Fail
1.3
Fail
2.5
Fail
1.2
Fail
1.1
Fail
1.1
Fail
2.2
Fail
1.4
Fail
1.3
Fail
1.1
Fail
1.9
Fail
2.7
Fail
2.5
Fail
2.2
Fail
1.9
Fail
White BG
2.4Fail
2.6Fail
2.9Fail
3.3AA Large
6.5AA
Black BG
8.9AAA
8.2AAA
7.2AAA
6.3AA
3.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

ACACA6
A7A79F
A3A39A
9F9E8F
61615E

Deuteranopia

ADADA6
A8AA9F
A6A999
A3A88E
62625D

Tritanopia

B0A6A6
AE9F9F
B39695
B98A88
655D5D

Achromatopsia

AAAAAA
A3A3A3
9A9A9A
909090
5F5F5F

Shades & Tints Shades & Tints

#B0A7A6

Dark
Light

#AF9DA0

Dark
Light

#B58C9E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b0a7a6;
  --color-2: #af9da0;
  --color-3: #b58c9e;
  --color-4: #bc7897;
  --color-5: #655c5e;
}

SCSS

$color-1: #b0a7a6;
$color-2: #af9da0;
$color-3: #b58c9e;
$color-4: #bc7897;
$color-5: #655c5e;

TAILWIND

colors: {
  'brand-1': '#b0a7a6',
  'brand-2': '#af9da0',
  'brand-3': '#b58c9e',
  'brand-4': '#bc7897',
  'brand-5': '#655c5e',
}

RGB Array

[176, 167, 166], [175, 157, 160], [181, 140, 158], [188, 120, 151], [101, 92, 94]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B0A7A6, #AF9DA0, #B58C9E, #BC7897, #655C5E 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: #b0a7a6; --color-2: #af9da0; --color-3: #b58c9e; --color-4: #bc7897; --color-5: #655c5e. 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