← Back to Editor

#D5D9BA · #90A398 · #5A5F6B · #463946 · #382D32

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

#D5D9BA

Fresh Green · LightGray · Lemon Cream

HEX
#D5D9BA
RGB
rgb(213, 217, 186)
HSL
hsl(68, 29%, 79%)
HSB
hsb(68, 14%, 85%)
CMYK
cmyk(2%, 0%, 14%, 15%)
Oklch
oklch(87.4% 0.042 113.2)

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

#90A398

Celadon · DarkSeaGreen · Silver Sand

HEX
#90A398
RGB
rgb(144, 163, 152)
HSL
hsl(145, 9%, 60%)
HSB
hsb(145, 12%, 64%)
CMYK
cmyk(12%, 0%, 7%, 36%)
Oklch
oklch(69.7% 0.027 160.3)

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

#5A5F6B

Indigo · DimGray · Charcoal

HEX
#5A5F6B
RGB
rgb(90, 95, 107)
HSL
hsl(222, 9%, 39%)
HSB
hsb(222, 16%, 42%)
CMYK
cmyk(16%, 11%, 0%, 58%)
Oklch
oklch(48.5% 0.020 267.6)

Traditional「Indigo」· Paint「Charcoal」· Creative Midnight Shadow

#463946

Rose Purple · DarkSlateGray · Eggplant

HEX
#463946
RGB
rgb(70, 57, 70)
HSL
hsl(300, 10%, 25%)
HSB
hsb(300, 19%, 27%)
CMYK
cmyk(0%, 19%, 0%, 73%)
Oklch
oklch(36.3% 0.028 326.1)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

#382D32

Dark Violet · DarkSlateGray · Raspberry

HEX
#382D32
RGB
rgb(56, 45, 50)
HSL
hsl(333, 11%, 20%)
HSB
hsb(333, 20%, 22%)
CMYK
cmyk(0%, 20%, 11%, 78%)
Oklch
oklch(31.1% 0.018 349.1)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D5D9BA
BEBAD9

Analogous

D9CEBA
D5D9BA
C5D9BA

Triadic

D5D9BA
BAD5D9
D9BAD5

Split-Comp.

D5D9BA
BAC5D9
CEBAD9

Tetradic

D5D9BA
BAD9CE
BEBAD9
D9BAC5

Contrast Matrix WCAG 2.1 Contrast

D5D9BA
90A398
5A5F6B
463946
382D32
—
1.8
Fail
4.4
AA Large
7.5
AAA
9.1
AAA
1.8
Fail
—
2.4
Fail
4.1
AA Large
5.0
AA
4.4
AA Large
2.4
Fail
—
1.7
Fail
2.1
Fail
7.5
AAA
4.1
AA Large
1.7
Fail
—
1.2
Fail
9.1
AAA
5.0
AA
2.1
Fail
1.2
Fail
—
White BG
1.5Fail
2.7Fail
6.4AA
10.9AAA
13.2AAA
Black BG
14.5AAA
7.9AAA
3.3AA Large
1.9Fail
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D7D7C2
98989B
5C5C68
404043
333331

Deuteranopia

D7D6C3
97969B
5C5C67
414242
343531

Tritanopia

D5C7C9
919D9D
5A6665
454040
373030

Achromatopsia

D4D4D4
9C9C9C
5F5F5F
3E3E3E
313131

Shades & Tints Shades & Tints

#D5D9BA

Dark
Light

#90A398

Dark
Light

#5A5F6B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d5d9ba;
  --color-2: #90a398;
  --color-3: #5a5f6b;
  --color-4: #463946;
  --color-5: #382d32;
}

SCSS

$color-1: #d5d9ba;
$color-2: #90a398;
$color-3: #5a5f6b;
$color-4: #463946;
$color-5: #382d32;

TAILWIND

colors: {
  'brand-1': '#d5d9ba',
  'brand-2': '#90a398',
  'brand-3': '#5a5f6b',
  'brand-4': '#463946',
  'brand-5': '#382d32',
}

RGB Array

[213, 217, 186], [144, 163, 152], [90, 95, 107], [70, 57, 70], [56, 45, 50]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #D5D9BA, #90A398, #5A5F6B, #463946, #382D32 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: #d5d9ba; --color-2: #90a398; --color-3: #5a5f6b; --color-4: #463946; --color-5: #382d32. 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