← Back to Editor

#C5CDB6 · #403D4E · #2E1B2F · #201E33 · #8A9392

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumCool

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporateData Visualization

Color Details Color Details

#C5CDB6

Willow Green · Silver · Apple Green

HEX
#C5CDB6
RGB
rgb(197, 205, 182)
HSL
hsl(81, 19%, 76%)
HSB
hsb(81, 11%, 80%)
CMYK
cmyk(4%, 0%, 11%, 20%)
Oklch
oklch(83.6% 0.033 122.7)

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

#403D4E

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#403D4E
RGB
rgb(64, 61, 78)
HSL
hsl(251, 12%, 27%)
HSB
hsb(251, 22%, 31%)
CMYK
cmyk(18%, 22%, 0%, 69%)
Oklch
oklch(37.0% 0.029 293.0)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#2E1B2F

Dark Plum · DarkSlateGray · Dark Purple

HEX
#2E1B2F
RGB
rgb(46, 27, 47)
HSL
hsl(297, 27%, 15%)
HSB
hsb(297, 43%, 18%)
CMYK
cmyk(2%, 43%, 0%, 82%)
Oklch
oklch(25.6% 0.045 325.1)

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

#201E33

Deep Indigo · DarkSlateGray · Deep Sea Blue

HEX
#201E33
RGB
rgb(32, 30, 51)
HSL
hsl(246, 26%, 16%)
HSB
hsb(246, 41%, 20%)
CMYK
cmyk(37%, 41%, 0%, 80%)
Oklch
oklch(24.8% 0.039 287.5)

Traditional「Deep Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#8A9392

Ash · LightSlateGray · Silver Sand

HEX
#8A9392
RGB
rgb(138, 147, 146)
HSL
hsl(173, 4%, 56%)
HSB
hsb(173, 6%, 58%)
CMYK
cmyk(6%, 0%, 1%, 42%)
Oklch
oklch(65.6% 0.011 188.9)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C5CDB6
BEB6CD

Analogous

CDCAB6
C5CDB6
BACDB6

Triadic

C5CDB6
B6C5CD
CDB6C5

Split-Comp.

C5CDB6
B6BACD
CAB6CD

Tetradic

C5CDB6
B6CDCA
BEB6CD
CDB6BA

Contrast Matrix WCAG 2.1 Contrast

C5CDB6
403D4E
2E1B2F
201E33
8A9392
—
6.4
AA
9.7
AAA
9.9
AAA
1.9
Fail
6.4
AA
—
1.5
Fail
1.5
Fail
3.3
AA Large
9.7
AAA
1.5
Fail
—
1.0
Fail
5.1
AA
9.9
AAA
1.5
Fail
1.0
Fail
—
5.2
AA
1.9
Fail
3.3
AA Large
5.1
AA
5.2
AA
—
White BG
1.6Fail
10.5AAA
16.0AAA
16.2AAA
3.1AA Large
Black BG
12.8AAA
2.0Fail
1.3Fail
1.3Fail
6.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C8C9BC
3F3F4A
26262A
1F1F2E
8E8E92

Deuteranopia

C8C7BD
3F3F49
272829
1F1F2D
8D8D92

Tritanopia

C5C0C1
404746
2D2626
202A29
8A9292

Achromatopsia

C8C8C8
404040
232323
212121
909090

Shades & Tints Shades & Tints

#C5CDB6

Dark
Light

#403D4E

Dark
Light

#2E1B2F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c5cdb6;
  --color-2: #403d4e;
  --color-3: #2e1b2f;
  --color-4: #201e33;
  --color-5: #8a9392;
}

SCSS

$color-1: #c5cdb6;
$color-2: #403d4e;
$color-3: #2e1b2f;
$color-4: #201e33;
$color-5: #8a9392;

TAILWIND

colors: {
  'brand-1': '#c5cdb6',
  'brand-2': '#403d4e',
  'brand-3': '#2e1b2f',
  'brand-4': '#201e33',
  'brand-5': '#8a9392',
}

RGB Array

[197, 205, 182], [64, 61, 78], [46, 27, 47], [32, 30, 51], [138, 147, 146]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C5CDB6, #403D4E, #2E1B2F, #201E33, #8A9392 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, 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: #c5cdb6; --color-2: #403d4e; --color-3: #2e1b2f; --color-4: #201e33; --color-5: #8a9392. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 general-style 5-color scheme is especially suited for finance, legal, luxury 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