← Back to Editor

#281229 · #543B3B · #B0A471 · #839960 · #48855D

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

#281229

Dark Plum · Black · Dark Purple

HEX
#281229
RGB
rgb(40, 18, 41)
HSL
hsl(297, 39%, 12%)
HSB
hsb(297, 56%, 16%)
CMYK
cmyk(2%, 56%, 0%, 84%)
Oklch
oklch(22.5% 0.053 325.6)

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

#543B3B

Crimson · DarkSlateGray · Wine Red

HEX
#543B3B
RGB
rgb(84, 59, 59)
HSL
hsl(0, 17%, 28%)
HSB
hsb(0, 30%, 33%)
CMYK
cmyk(0%, 30%, 30%, 67%)
Oklch
oklch(38.1% 0.036 18.8)

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

#B0A471

Ginger · Tan · Sunflower

HEX
#B0A471
RGB
rgb(176, 164, 113)
HSL
hsl(49, 29%, 57%)
HSB
hsb(49, 36%, 69%)
CMYK
cmyk(0%, 7%, 36%, 31%)
Oklch
oklch(71.7% 0.070 96.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#839960

Grass Green · Gray · Olive Green

HEX
#839960
RGB
rgb(131, 153, 96)
HSL
hsl(83, 23%, 49%)
HSB
hsb(83, 37%, 60%)
CMYK
cmyk(14%, 0%, 37%, 40%)
Oklch
oklch(65.1% 0.084 125.8)

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

#48855D

Celadon · SeaGreen · Forest Green

HEX
#48855D
RGB
rgb(72, 133, 93)
HSL
hsl(141, 30%, 40%)
HSB
hsb(141, 46%, 52%)
CMYK
cmyk(46%, 0%, 30%, 48%)
Oklch
oklch(56.4% 0.089 153.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

281229
142B13

Analogous

1D132B
281229
2B1320

Triadic

281229
2B2913
132B29

Split-Comp.

281229
202B13
132B1D

Tetradic

281229
2B1D13
142B13
13202B

Contrast Matrix WCAG 2.1 Contrast

281229
543B3B
B0A471
839960
48855D
—
1.7
Fail
6.9
AA
5.5
AA
4.0
AA Large
1.7
Fail
—
4.1
AA Large
3.2
AA Large
2.3
Fail
6.9
AA
4.1
AA Large
—
1.3
Fail
1.8
Fail
5.5
AA
3.2
AA Large
1.3
Fail
—
1.4
Fail
4.0
AA Large
2.3
Fail
1.8
Fail
1.4
Fail
—
White BG
17.4AAA
10.2AAA
2.5Fail
3.1AA Large
4.4AA Large
Black BG
1.2Fail
2.1Fail
8.4AAA
6.7AA
4.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1E1E23
49493B
ABAB7D
8D8D6E
626367

Deuteranopia

202122
4B4D3B
ACAC80
8B8A71
5F5A69

Tritanopia

271F1E
533B3B
AF8789
84797B
4B6E70

Achromatopsia

1B1B1B
424242
A2A2A2
8C8C8C
6E6E6E

Shades & Tints Shades & Tints

#281229

Dark
Light

#543B3B

Dark
Light

#B0A471

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #281229;
  --color-2: #543b3b;
  --color-3: #b0a471;
  --color-4: #839960;
  --color-5: #48855d;
}

SCSS

$color-1: #281229;
$color-2: #543b3b;
$color-3: #b0a471;
$color-4: #839960;
$color-5: #48855d;

TAILWIND

colors: {
  'brand-1': '#281229',
  'brand-2': '#543b3b',
  'brand-3': '#b0a471',
  'brand-4': '#839960',
  'brand-5': '#48855d',
}

RGB Array

[40, 18, 41], [84, 59, 59], [176, 164, 113], [131, 153, 96], [72, 133, 93]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #281229, #543B3B, #B0A471, #839960, #48855D 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: #281229; --color-2: #543b3b; --color-3: #b0a471; --color-4: #839960; --color-5: #48855d. 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