← Back to Editor

#420B1E · #6E7F74 · #CE3F1D · #DDCF9D · #761C1D

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#420B1E

Dark Violet · Maroon · Raspberry

HEX
#420B1E
RGB
rgb(66, 11, 30)
HSL
hsl(339, 71%, 15%)
HSB
hsb(339, 83%, 26%)
CMYK
cmyk(0%, 83%, 55%, 74%)
Oklch
oklch(25.7% 0.085 4.7)

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

#6E7F74

Ink Gray · Gray · Warm Gray

HEX
#6E7F74
RGB
rgb(110, 127, 116)
HSL
hsl(141, 7%, 46%)
HSB
hsb(141, 13%, 50%)
CMYK
cmyk(13%, 0%, 9%, 50%)
Oklch
oklch(57.9% 0.026 157.1)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#CE3F1D

Vermilion · FireBrick · Passion Red

HEX
#CE3F1D
RGB
rgb(206, 63, 29)
HSL
hsl(12, 75%, 46%)
HSB
hsb(12, 86%, 81%)
CMYK
cmyk(0%, 69%, 86%, 19%)
Oklch
oklch(57.2% 0.185 34.2)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#DDCF9D

Goose Yellow · BurlyWood · Sunflower

HEX
#DDCF9D
RGB
rgb(221, 207, 157)
HSL
hsl(47, 48%, 74%)
HSB
hsb(47, 29%, 87%)
CMYK
cmyk(0%, 6%, 29%, 13%)
Oklch
oklch(85.4% 0.067 94.3)

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

#761C1D

Vermilion · Maroon · Wine Red

HEX
#761C1D
RGB
rgb(118, 28, 29)
HSL
hsl(359, 62%, 29%)
HSB
hsb(359, 76%, 46%)
CMYK
cmyk(0%, 76%, 75%, 54%)
Oklch
oklch(37.8% 0.124 24.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

420B1E
0B412E

Analogous

410B39
420B1E
41130B

Triadic

420B1E
1E410B
0B1E41

Split-Comp.

420B1E
0B4113
0B3941

Tetradic

420B1E
39410B
0B412E
130B41

Contrast Matrix WCAG 2.1 Contrast

420B1E
6E7F74
CE3F1D
DDCF9D
761C1D
—
3.8
AA Large
3.4
AA Large
10.4
AAA
1.5
Fail
3.8
AA Large
—
1.1
Fail
2.7
Fail
2.5
Fail
3.4
AA Large
1.1
Fail
—
3.1
AA Large
2.2
Fail
10.4
AAA
2.7
Fail
3.1
AA Large
—
6.9
AA
1.5
Fail
2.5
Fail
2.2
Fail
6.9
AA
—
White BG
16.2AAA
4.2AA Large
4.8AA
1.6Fail
10.7AAA
Black BG
1.3Fail
5.0AA
4.4AA Large
13.5AAA
2.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

2A2A19
757677
908F25
D7D7A9
4F4E1D

Deuteranopia

2D3118
747377
98A327
D8D9AC
545B1D

Tritanopia

3F1615
6F7979
C72C2D
DCB3B5
721D1D

Achromatopsia

1E1E1E
797979
666666
CDCDCD
373737

Shades & Tints Shades & Tints

#420B1E

Dark
Light

#6E7F74

Dark
Light

#CE3F1D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #420b1e;
  --color-2: #6e7f74;
  --color-3: #ce3f1d;
  --color-4: #ddcf9d;
  --color-5: #761c1d;
}

SCSS

$color-1: #420b1e;
$color-2: #6e7f74;
$color-3: #ce3f1d;
$color-4: #ddcf9d;
$color-5: #761c1d;

TAILWIND

colors: {
  'brand-1': '#420b1e',
  'brand-2': '#6e7f74',
  'brand-3': '#ce3f1d',
  'brand-4': '#ddcf9d',
  'brand-5': '#761c1d',
}

RGB Array

[66, 11, 30], [110, 127, 116], [206, 63, 29], [221, 207, 157], [118, 28, 29]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #420B1E, #6E7F74, #CE3F1D, #DDCF9D, #761C1D is ideal for: 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: #420b1e; --color-2: #6e7f74; --color-3: #ce3f1d; --color-4: #ddcf9d; --color-5: #761c1d. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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