← Back to Editor

#2A1011 · #542626 · #20354A · #DA9C21 · #F6EDCE

A 5-color palette 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

#2A1011

Crimson · Black · Deep Berry

HEX
#2A1011
RGB
rgb(42, 16, 17)
HSL
hsl(358, 45%, 11%)
HSB
hsb(358, 62%, 16%)
CMYK
cmyk(0%, 62%, 60%, 84%)
Oklch
oklch(21.4% 0.043 19.0)

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

#542626

Crimson · DarkSlateGray · Wine Red

HEX
#542626
RGB
rgb(84, 38, 38)
HSL
hsl(0, 38%, 24%)
HSB
hsb(0, 55%, 33%)
CMYK
cmyk(0%, 55%, 55%, 67%)
Oklch
oklch(33.3% 0.069 21.5)

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

#20354A

Indigo · DarkSlateGray · Prussian Blue

HEX
#20354A
RGB
rgb(32, 53, 74)
HSL
hsl(210, 40%, 21%)
HSB
hsb(210, 57%, 29%)
CMYK
cmyk(57%, 28%, 0%, 71%)
Oklch
oklch(32.2% 0.046 249.4)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#DA9C21

Ochre · GoldenRod · Honey Gold

HEX
#DA9C21
RGB
rgb(218, 156, 33)
HSL
hsl(40, 74%, 49%)
HSB
hsb(40, 85%, 85%)
CMYK
cmyk(0%, 28%, 85%, 15%)
Oklch
oklch(73.4% 0.145 78.3)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#F6EDCE

Goose Yellow · Beige · Lemon Cream

HEX
#F6EDCE
RGB
rgb(246, 237, 206)
HSL
hsl(47, 69%, 89%)
HSB
hsb(47, 16%, 96%)
CMYK
cmyk(0%, 4%, 16%, 4%)
Oklch
oklch(94.5% 0.042 93.7)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2A1011
0F2928

Analogous

290F1D
2A1011
291B0F

Triadic

2A1011
10290F
0F1029

Split-Comp.

2A1011
0F291B
0F1D29

Tetradic

2A1011
1D290F
0F2928
1B0F29

Contrast Matrix WCAG 2.1 Contrast

2A1011
542626
20354A
DA9C21
F6EDCE
—
1.4
Fail
1.4
Fail
7.4
AAA
15.2
AAA
1.4
Fail
—
1.0
Fail
5.2
AA
10.7
AAA
1.4
Fail
1.0
Fail
—
5.2
AA
10.7
AAA
7.4
AAA
5.2
AA
5.2
AA
—
2.0
Fail
15.2
AAA
10.7
AAA
10.7
AAA
2.0
Fail
—
White BG
17.8AAA
12.5AAA
12.6AAA
2.4Fail
1.2Fail
Black BG
1.2Fail
1.7Fail
1.7Fail
8.8AAA
17.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1F1F11
404026
292945
BFBF3F
F2F2D6

Deuteranopia

202211
434626
282644
C3C746
F3F3D7

Tritanopia

291111
522626
214140
D7565B
F6DBDD

Achromatopsia

181818
343434
313131
A1A1A1
ECECEC

Shades & Tints Shades & Tints

#2A1011

Dark
Light

#542626

Dark
Light

#20354A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2a1011;
  --color-2: #542626;
  --color-3: #20354a;
  --color-4: #da9c21;
  --color-5: #f6edce;
}

SCSS

$color-1: #2a1011;
$color-2: #542626;
$color-3: #20354a;
$color-4: #da9c21;
$color-5: #f6edce;

TAILWIND

colors: {
  'brand-1': '#2a1011',
  'brand-2': '#542626',
  'brand-3': '#20354a',
  'brand-4': '#da9c21',
  'brand-5': '#f6edce',
}

RGB Array

[42, 16, 17], [84, 38, 38], [32, 53, 74], [218, 156, 33], [246, 237, 206]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2A1011, #542626, #20354A, #DA9C21, #F6EDCE is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #2a1011; --color-2: #542626; --color-3: #20354a; --color-4: #da9c21; --color-5: #f6edce. 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 tech, SaaS, healthcare, eco industries. 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