← Back to Editor

#8B7871 · #BAB1A8 · #B1A3A0 · #BD9B9C · #DBCBCC

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

#8B7871

Tangerine · Gray · Amber Brown

HEX
#8B7871
RGB
rgb(139, 120, 113)
HSL
hsl(16, 10%, 49%)
HSB
hsb(16, 19%, 55%)
CMYK
cmyk(0%, 14%, 19%, 45%)
Oklch
oklch(58.8% 0.026 41.3)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#BAB1A8

Ginger · DarkGray · Warm Sun

HEX
#BAB1A8
RGB
rgb(186, 177, 168)
HSL
hsl(30, 12%, 69%)
HSB
hsb(30, 10%, 73%)
CMYK
cmyk(0%, 5%, 10%, 27%)
Oklch
oklch(76.5% 0.016 67.6)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#B1A3A0

Peach Pink · DarkGray · Coral Red

HEX
#B1A3A0
RGB
rgb(177, 163, 160)
HSL
hsl(11, 10%, 66%)
HSB
hsb(11, 10%, 69%)
CMYK
cmyk(0%, 8%, 10%, 31%)
Oklch
oklch(72.7% 0.017 32.0)

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

#BD9B9C

Peach Pink · DarkGray · Coral Red

HEX
#BD9B9C
RGB
rgb(189, 155, 156)
HSL
hsl(358, 20%, 67%)
HSB
hsb(358, 18%, 74%)
CMYK
cmyk(0%, 18%, 17%, 26%)
Oklch
oklch(72.1% 0.041 16.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#DBCBCC

Peach Pink · LightGray · Cherry Blossom

HEX
#DBCBCC
RGB
rgb(219, 203, 204)
HSL
hsl(356, 18%, 83%)
HSB
hsb(356, 7%, 86%)
CMYK
cmyk(0%, 7%, 7%, 14%)
Oklch
oklch(85.5% 0.018 13.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8B7871
708389

Analogous

897076
8B7871
898470

Triadic

8B7871
708977
777089

Split-Comp.

8B7871
708984
707689

Tetradic

8B7871
768970
708389
847089

Contrast Matrix WCAG 2.1 Contrast

8B7871
BAB1A8
B1A3A0
BD9B9C
DBCBCC
—
2.0
Fail
1.7
Fail
1.7
Fail
2.7
Fail
2.0
Fail
—
1.2
Fail
1.2
Fail
1.4
Fail
1.7
Fail
1.2
Fail
—
1.0
Fail
1.6
Fail
1.7
Fail
1.2
Fail
1.0
Fail
—
1.6
Fail
2.7
Fail
1.4
Fail
1.6
Fail
1.6
Fail
—
White BG
4.2AA Large
2.1Fail
2.4Fail
2.5Fail
1.6Fail
Black BG
5.0AA
9.9AAA
8.6AAA
8.3AAA
13.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

838373
B6B6AA
ABABA1
AEAE9C
D4D4CC

Deuteranopia

848573
B7B7AB
ACADA1
B0B39C
D5D6CC

Tritanopia

8A7474
BAACAC
B0A1A1
BB9C9C
DACCCC

Achromatopsia

7D7D7D
B3B3B3
A7A7A7
A5A5A5
D0D0D0

Shades & Tints Shades & Tints

#8B7871

Dark
Light

#BAB1A8

Dark
Light

#B1A3A0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8b7871;
  --color-2: #bab1a8;
  --color-3: #b1a3a0;
  --color-4: #bd9b9c;
  --color-5: #dbcbcc;
}

SCSS

$color-1: #8b7871;
$color-2: #bab1a8;
$color-3: #b1a3a0;
$color-4: #bd9b9c;
$color-5: #dbcbcc;

TAILWIND

colors: {
  'brand-1': '#8b7871',
  'brand-2': '#bab1a8',
  'brand-3': '#b1a3a0',
  'brand-4': '#bd9b9c',
  'brand-5': '#dbcbcc',
}

RGB Array

[139, 120, 113], [186, 177, 168], [177, 163, 160], [189, 155, 156], [219, 203, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8B7871, #BAB1A8, #B1A3A0, #BD9B9C, #DBCBCC 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: #8b7871; --color-2: #bab1a8; --color-3: #b1a3a0; --color-4: #bd9b9c; --color-5: #dbcbcc. 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