← Back to Editor

#281D23 · #352D2B · #595748 · #9A9A78 · #C0CBA9

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarm

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporateData Visualization

Color Details Color Details

#281D23

Rose Purple · Black · Raspberry

HEX
#281D23
RGB
rgb(40, 29, 35)
HSL
hsl(327, 16%, 14%)
HSB
hsb(327, 28%, 16%)
CMYK
cmyk(0%, 27%, 13%, 84%)
Oklch
oklch(24.6% 0.020 344.8)

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

#352D2B

Crimson · DarkSlateGray · Deep Berry

HEX
#352D2B
RGB
rgb(53, 45, 43)
HSL
hsl(12, 10%, 19%)
HSB
hsb(12, 19%, 21%)
CMYK
cmyk(0%, 15%, 19%, 79%)
Oklch
oklch(30.5% 0.012 34.3)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#595748

Autumn Sage · DarkOliveGreen · Honey Gold

HEX
#595748
RGB
rgb(89, 87, 72)
HSL
hsl(53, 11%, 32%)
HSB
hsb(53, 19%, 35%)
CMYK
cmyk(0%, 2%, 19%, 65%)
Oklch
oklch(45.4% 0.024 101.0)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#9A9A78

Autumn Sage · Gray · Sunflower

HEX
#9A9A78
RGB
rgb(154, 154, 120)
HSL
hsl(60, 14%, 54%)
HSB
hsb(60, 22%, 60%)
CMYK
cmyk(0%, 0%, 22%, 40%)
Oklch
oklch(67.7% 0.048 107.6)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#C0CBA9

Willow Green · Silver · Apple Green

HEX
#C0CBA9
RGB
rgb(192, 203, 169)
HSL
hsl(79, 25%, 73%)
HSB
hsb(79, 17%, 80%)
CMYK
cmyk(5%, 0%, 17%, 20%)
Oklch
oklch(82.5% 0.048 122.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

281D23
1E2923

Analogous

291E29
281D23
291E1F

Triadic

281D23
24291E
1E2429

Split-Comp.

281D23
1F291E
1E2929

Tetradic

281D23
29291E
1E2923
1E1F29

Contrast Matrix WCAG 2.1 Contrast

281D23
352D2B
595748
9A9A78
C0CBA9
—
1.2
Fail
2.2
Fail
5.6
AA
9.6
AAA
1.2
Fail
—
1.8
Fail
4.7
AA
7.9
AAA
2.2
Fail
1.8
Fail
—
2.5
Fail
4.3
AA Large
5.6
AA
4.7
AA
2.5
Fail
—
1.7
Fail
9.6
AAA
7.9
AAA
4.3
AA Large
1.7
Fail
—
White BG
16.3AAA
13.4AAA
7.3AAA
2.9Fail
1.7Fail
Black BG
1.3Fail
1.6Fail
2.9Fail
7.3AAA
12.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

232322
32312B
58584C
9A9A80
C5C5B1

Deuteranopia

242521
32332C
58584D
9A9A82
C4C3B3

Tritanopia

272020
352C2C
594E4F
9A8788
C1B8B9

Achromatopsia

212121
2F2F2F
565656
969696
C4C4C4

Shades & Tints Shades & Tints

#281D23

Dark
Light

#352D2B

Dark
Light

#595748

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #281d23;
  --color-2: #352d2b;
  --color-3: #595748;
  --color-4: #9a9a78;
  --color-5: #c0cba9;
}

SCSS

$color-1: #281d23;
$color-2: #352d2b;
$color-3: #595748;
$color-4: #9a9a78;
$color-5: #c0cba9;

TAILWIND

colors: {
  'brand-1': '#281d23',
  'brand-2': '#352d2b',
  'brand-3': '#595748',
  'brand-4': '#9a9a78',
  'brand-5': '#c0cba9',
}

RGB Array

[40, 29, 35], [53, 45, 43], [89, 87, 72], [154, 154, 120], [192, 203, 169]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #281D23, #352D2B, #595748, #9A9A78, #C0CBA9 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: #281d23; --color-2: #352d2b; --color-3: #595748; --color-4: #9a9a78; --color-5: #c0cba9. 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