← Back to Editor

#C8C1BB · #BAA59B · #AC897C · #9E6D5C · #ED7B8A

dark

A 5-color dark 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

#C8C1BB

Apricot · Silver · Peach Orange

HEX
#C8C1BB
RGB
rgb(200, 193, 187)
HSL
hsl(28, 11%, 76%)
HSB
hsb(28, 7%, 78%)
CMYK
cmyk(0%, 4%, 7%, 22%)
Oklch
oklch(81.5% 0.011 63.3)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#BAA59B

Apricot · DarkGray · Warm Sun

HEX
#BAA59B
RGB
rgb(186, 165, 155)
HSL
hsl(19, 18%, 67%)
HSB
hsb(19, 17%, 73%)
CMYK
cmyk(0%, 11%, 17%, 27%)
Oklch
oklch(73.7% 0.028 47.1)

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

#AC897C

Tangerine · Gray · Warm Sun

HEX
#AC897C
RGB
rgb(172, 137, 124)
HSL
hsl(16, 22%, 58%)
HSB
hsb(16, 28%, 67%)
CMYK
cmyk(0%, 20%, 28%, 33%)
Oklch
oklch(65.9% 0.047 41.4)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#9E6D5C

Tangerine · Gray · Amber Brown

HEX
#9E6D5C
RGB
rgb(158, 109, 92)
HSL
hsl(15, 26%, 49%)
HSB
hsb(15, 42%, 62%)
CMYK
cmyk(0%, 31%, 42%, 38%)
Oklch
oklch(58.1% 0.068 39.9)

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

#ED7B8A

Peach Pink · LightCoral · Coral Red

HEX
#ED7B8A
RGB
rgb(237, 123, 138)
HSL
hsl(352, 76%, 71%)
HSB
hsb(352, 48%, 93%)
CMYK
cmyk(0%, 48%, 42%, 7%)
Oklch
oklch(71.6% 0.141 13.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C8C1BB
BBC2C9

Analogous

C9BBBC
C8C1BB
C9C8BB

Triadic

C8C1BB
BBC9C1
C1BBC9

Split-Comp.

C8C1BB
BBC9C8
BBBCC9

Tetradic

C8C1BB
BCC9BB
BBC2C9
C8BBC9

Contrast Matrix WCAG 2.1 Contrast

C8C1BB
BAA59B
AC897C
9E6D5C
ED7B8A
—
1.3
Fail
1.8
Fail
2.5
Fail
1.5
Fail
1.3
Fail
—
1.4
Fail
1.9
Fail
1.1
Fail
1.8
Fail
1.4
Fail
—
1.4
Fail
1.2
Fail
2.5
Fail
1.9
Fail
1.4
Fail
—
1.6
Fail
1.5
Fail
1.1
Fail
1.2
Fail
1.6
Fail
—
White BG
1.8Fail
2.3Fail
3.2AA Large
4.4AA Large
2.7Fail
Black BG
11.8AAA
8.9AAA
6.6AA
4.8AA
7.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C5C5BC
B1B19D
9D9D7F
898860
BCBB86

Deuteranopia

C5C6BD
B2B49E
9FA280
8C8F61
C2CB86

Tritanopia

C8BEBE
B99FA0
AA8282
9C6364
E78483

Achromatopsia

C2C2C2
AAAAAA
929292
7A7A7A
9F9F9F

Shades & Tints Shades & Tints

#C8C1BB

Dark
Light

#BAA59B

Dark
Light

#AC897C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c8c1bb;
  --color-2: #baa59b;
  --color-3: #ac897c;
  --color-4: #9e6d5c;
  --color-5: #ed7b8a;
}

SCSS

$color-1: #c8c1bb;
$color-2: #baa59b;
$color-3: #ac897c;
$color-4: #9e6d5c;
$color-5: #ed7b8a;

TAILWIND

colors: {
  'brand-1': '#c8c1bb',
  'brand-2': '#baa59b',
  'brand-3': '#ac897c',
  'brand-4': '#9e6d5c',
  'brand-5': '#ed7b8a',
}

RGB Array

[200, 193, 187], [186, 165, 155], [172, 137, 124], [158, 109, 92], [237, 123, 138]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #C8C1BB, #BAA59B, #AC897C, #9E6D5C, #ED7B8A is ideal for: corporate websites, product showcases, portfolios. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #c8c1bb; --color-2: #baa59b; --color-3: #ac897c; --color-4: #9e6d5c; --color-5: #ed7b8a. 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 dark-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. 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