← Back to Editor

#CBC8AB · #A4B1A0 · #707969 · #465B57 · #375253

dark

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#CBC8AB

Fresh Green · Silver · Sunflower

HEX
#CBC8AB
RGB
rgb(203, 200, 171)
HSL
hsl(54, 24%, 73%)
HSB
hsb(54, 16%, 80%)
CMYK
cmyk(0%, 1%, 16%, 20%)
Oklch
oklch(82.8% 0.039 102.4)

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

#A4B1A0

Celadon · DarkGray · Apple Green

HEX
#A4B1A0
RGB
rgb(164, 177, 160)
HSL
hsl(106, 10%, 66%)
HSB
hsb(106, 10%, 69%)
CMYK
cmyk(7%, 0%, 10%, 31%)
Oklch
oklch(74.5% 0.028 138.3)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#707969

Ink Gray · DimGray · Warm Gray

HEX
#707969
RGB
rgb(112, 121, 105)
HSL
hsl(94, 7%, 44%)
HSB
hsb(94, 13%, 47%)
CMYK
cmyk(7%, 0%, 13%, 53%)
Oklch
oklch(56.4% 0.026 131.4)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#465B57

Mineral Blue · DarkSlateGray · Mint Ice

HEX
#465B57
RGB
rgb(70, 91, 87)
HSL
hsl(169, 13%, 32%)
HSB
hsb(169, 23%, 36%)
CMYK
cmyk(23%, 0%, 4%, 64%)
Oklch
oklch(45.3% 0.026 182.2)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#375253

Slate Blue · DarkSlateGray · Mint Ice

HEX
#375253
RGB
rgb(55, 82, 83)
HSL
hsl(182, 20%, 27%)
HSB
hsb(182, 34%, 33%)
CMYK
cmyk(34%, 1%, 0%, 67%)
Oklch
oklch(41.7% 0.032 198.9)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CBC8AB
AAADCB

Analogous

CBB7AA
CBC8AB
BDCBAA

Triadic

CBC8AB
AACBC7
C7AACB

Split-Comp.

CBC8AB
AABDCB
B7AACB

Tetradic

CBC8AB
AACBB7
AAADCB
CBAABD

Contrast Matrix WCAG 2.1 Contrast

CBC8AB
A4B1A0
707969
465B57
375253
—
1.3
Fail
2.7
Fail
4.3
AA Large
5.0
AA
1.3
Fail
—
2.0
Fail
3.2
AA Large
3.8
AA Large
2.7
Fail
2.0
Fail
—
1.6
Fail
1.9
Fail
4.3
AA Large
3.2
AA Large
1.6
Fail
—
1.2
Fail
5.0
AA
3.8
AA Large
1.9
Fail
1.2
Fail
—
White BG
1.7Fail
2.2Fail
4.5AA
7.3AAA
8.4AAA
Black BG
12.4AAA
9.4AAA
4.6AA
2.9Fail
2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

CACAB2
AAAAA4
74746D
4F4F58
434353

Deuteranopia

CACAB4
A9A8A5
73736E
4E4C58
413F53

Tritanopia

CBB8B9
A5A7A8
707071
475959
385353

Achromatopsia

C6C6C6
ABABAB
747474
545454
4A4A4A

Shades & Tints Shades & Tints

#CBC8AB

Dark
Light

#A4B1A0

Dark
Light

#707969

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cbc8ab;
  --color-2: #a4b1a0;
  --color-3: #707969;
  --color-4: #465b57;
  --color-5: #375253;
}

SCSS

$color-1: #cbc8ab;
$color-2: #a4b1a0;
$color-3: #707969;
$color-4: #465b57;
$color-5: #375253;

TAILWIND

colors: {
  'brand-1': '#cbc8ab',
  'brand-2': '#a4b1a0',
  'brand-3': '#707969',
  'brand-4': '#465b57',
  'brand-5': '#375253',
}

RGB Array

[203, 200, 171], [164, 177, 160], [112, 121, 105], [70, 91, 87], [55, 82, 83]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #CBC8AB, #A4B1A0, #707969, #465B57, #375253 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #cbc8ab; --color-2: #a4b1a0; --color-3: #707969; --color-4: #465b57; --color-5: #375253. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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. 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