← Back to Editor

#402931 · #463E3C · #596944 · #7A9A73 · #A9BE93

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

#402931

Dark Violet · DarkSlateGray · Raspberry

HEX
#402931
RGB
rgb(64, 41, 49)
HSL
hsl(339, 22%, 21%)
HSB
hsb(339, 36%, 25%)
CMYK
cmyk(0%, 36%, 23%, 75%)
Oklch
oklch(31.2% 0.037 356.9)

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

#463E3C

Crimson · DarkSlateGray · Dark Stone

HEX
#463E3C
RGB
rgb(70, 62, 60)
HSL
hsl(12, 8%, 25%)
HSB
hsb(12, 14%, 27%)
CMYK
cmyk(0%, 11%, 14%, 73%)
Oklch
oklch(37.1% 0.012 34.3)

Traditional「Crimson」· Paint「Dark Stone」· Creative Midnight Shadow

#596944

Grass Green · DarkOliveGreen · Forest Green

HEX
#596944
RGB
rgb(89, 105, 68)
HSL
hsl(86, 21%, 34%)
HSB
hsb(86, 35%, 41%)
CMYK
cmyk(15%, 0%, 35%, 59%)
Oklch
oklch(49.7% 0.059 127.4)

Traditional「Grass Green」· Paint「Forest Green」· Creative Blush Sunrise

#7A9A73

Celadon · Gray · Olive Green

HEX
#7A9A73
RGB
rgb(122, 154, 115)
HSL
hsl(109, 16%, 53%)
HSB
hsb(109, 25%, 60%)
CMYK
cmyk(21%, 0%, 25%, 40%)
Oklch
oklch(65.1% 0.067 140.0)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#A9BE93

Willow Green · DarkSeaGreen · Apple Green

HEX
#A9BE93
RGB
rgb(169, 190, 147)
HSL
hsl(89, 25%, 66%)
HSB
hsb(89, 23%, 75%)
CMYK
cmyk(11%, 0%, 23%, 25%)
Oklch
oklch(77.4% 0.064 129.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

402931
2A4139

Analogous

412A3E
402931
412D2A

Triadic

402931
32412A
2A3241

Split-Comp.

402931
2A412D
2A3E41

Tetradic

402931
3E412A
2A4139
2D2A41

Contrast Matrix WCAG 2.1 Contrast

402931
463E3C
596944
7A9A73
A9BE93
—
1.3
Fail
2.2
Fail
4.2
AA Large
6.6
AA
1.3
Fail
—
1.8
Fail
3.3
AA Large
5.2
AA
2.2
Fail
1.8
Fail
—
1.9
Fail
3.0
Fail
4.2
AA Large
3.3
AA Large
1.9
Fail
—
1.6
Fail
6.6
AA
5.2
AA
3.0
Fail
1.6
Fail
—
White BG
13.3AAA
10.4AAA
6.0AA
3.1AA Large
2.0Fail
Black BG
1.6Fail
2.0Fail
3.5AA Large
6.7AA
10.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

36362F
43423C
60604D
88887C
B2B29D

Deuteranopia

37392F
43443D
5F5E4F
86847F
B1AFA0

Tritanopia

3F2E2D
463D3D
5A5456
7C8486
AAA6A7

Achromatopsia

313131
404040
606060
8C8C8C
B3B3B3

Shades & Tints Shades & Tints

#402931

Dark
Light

#463E3C

Dark
Light

#596944

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #402931;
  --color-2: #463e3c;
  --color-3: #596944;
  --color-4: #7a9a73;
  --color-5: #a9be93;
}

SCSS

$color-1: #402931;
$color-2: #463e3c;
$color-3: #596944;
$color-4: #7a9a73;
$color-5: #a9be93;

TAILWIND

colors: {
  'brand-1': '#402931',
  'brand-2': '#463e3c',
  'brand-3': '#596944',
  'brand-4': '#7a9a73',
  'brand-5': '#a9be93',
}

RGB Array

[64, 41, 49], [70, 62, 60], [89, 105, 68], [122, 154, 115], [169, 190, 147]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #402931, #463E3C, #596944, #7A9A73, #A9BE93 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: #402931; --color-2: #463e3c; --color-3: #596944; --color-4: #7a9a73; --color-5: #a9be93. 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