← Back to Editor

#311819 · #461832 · #604845 · #A8A875 · #A8C093

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

#311819

Crimson · Black · Deep Berry

HEX
#311819
RGB
rgb(49, 24, 25)
HSL
hsl(358, 34%, 14%)
HSB
hsb(358, 51%, 19%)
CMYK
cmyk(0%, 51%, 49%, 81%)
Oklch
oklch(24.5% 0.040 17.9)

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

#461832

Rose Purple · DarkSlateGray · Raspberry

HEX
#461832
RGB
rgb(70, 24, 50)
HSL
hsl(326, 49%, 18%)
HSB
hsb(326, 66%, 27%)
CMYK
cmyk(0%, 66%, 29%, 73%)
Oklch
oklch(29.0% 0.078 348.1)

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

#604845

Crimson · DarkOliveGreen · Wine Red

HEX
#604845
RGB
rgb(96, 72, 69)
HSL
hsl(7, 16%, 32%)
HSB
hsb(7, 28%, 38%)
CMYK
cmyk(0%, 25%, 28%, 62%)
Oklch
oklch(42.6% 0.033 26.7)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#A8A875

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#A8A875
RGB
rgb(168, 168, 117)
HSL
hsl(60, 23%, 56%)
HSB
hsb(60, 30%, 66%)
CMYK
cmyk(0%, 0%, 30%, 34%)
Oklch
oklch(71.9% 0.069 108.0)

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

#A8C093

Celadon · DarkSeaGreen · Apple Green

HEX
#A8C093
RGB
rgb(168, 192, 147)
HSL
hsl(92, 26%, 66%)
HSB
hsb(92, 23%, 75%)
CMYK
cmyk(13%, 0%, 23%, 25%)
Oklch
oklch(77.8% 0.067 130.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

311819
18302F

Analogous

301825
311819
302318

Triadic

311819
183018
181830

Split-Comp.

311819
183023
182530

Tetradic

311819
253018
18302F
231830

Contrast Matrix WCAG 2.1 Contrast

311819
461832
604845
A8A875
A8C093
—
1.1
Fail
2.0
Fail
6.7
AA
8.3
AAA
1.1
Fail
—
1.7
Fail
5.9
AA
7.4
AAA
2.0
Fail
1.7
Fail
—
3.4
AA Large
4.2
AA Large
6.7
AA
5.9
AA
3.4
AA Large
—
1.2
Fail
8.3
AAA
7.4
AAA
4.2
AA Large
1.2
Fail
—
White BG
16.5AAA
14.6AAA
8.4AAA
2.5Fail
2.0Fail
Black BG
1.3Fail
1.4Fail
2.5Fail
8.5AAA
10.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

262619
32322C
565546
A8A881
B2B39E

Deuteranopia

282A19
35382A
575946
A8A884
B1AFA1

Tritanopia

301919
442726
5F4646
A88B8D
A9A6A8

Achromatopsia

202020
292929
4F4F4F
A2A2A2
B4B4B4

Shades & Tints Shades & Tints

#311819

Dark
Light

#461832

Dark
Light

#604845

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #311819;
  --color-2: #461832;
  --color-3: #604845;
  --color-4: #a8a875;
  --color-5: #a8c093;
}

SCSS

$color-1: #311819;
$color-2: #461832;
$color-3: #604845;
$color-4: #a8a875;
$color-5: #a8c093;

TAILWIND

colors: {
  'brand-1': '#311819',
  'brand-2': '#461832',
  'brand-3': '#604845',
  'brand-4': '#a8a875',
  'brand-5': '#a8c093',
}

RGB Array

[49, 24, 25], [70, 24, 50], [96, 72, 69], [168, 168, 117], [168, 192, 147]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #311819, #461832, #604845, #A8A875, #A8C093 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: #311819; --color-2: #461832; --color-3: #604845; --color-4: #a8a875; --color-5: #a8c093. 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