← Back to Editor

#21220F · #C7BEB4 · #DAAD66 · #8B7978 · #C40519

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

#21220F

Autumn Sage · Black · Amber Gold

HEX
#21220F
RGB
rgb(33, 34, 15)
HSL
hsl(63, 39%, 10%)
HSB
hsb(63, 56%, 13%)
CMYK
cmyk(3%, 0%, 56%, 87%)
Oklch
oklch(24.5% 0.033 111.2)

Traditional「Autumn Sage」· Paint「Amber Gold」· Creative Blush Sunrise

#C7BEB4

Goose Yellow · Silver · Warm Sun

HEX
#C7BEB4
RGB
rgb(199, 190, 180)
HSL
hsl(32, 15%, 74%)
HSB
hsb(32, 10%, 78%)
CMYK
cmyk(0%, 5%, 10%, 22%)
Oklch
oklch(80.6% 0.017 70.5)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#DAAD66

Ginger · SandyBrown · Warm Sun

HEX
#DAAD66
RGB
rgb(218, 173, 102)
HSL
hsl(37, 61%, 63%)
HSB
hsb(37, 53%, 85%)
CMYK
cmyk(0%, 21%, 53%, 15%)
Oklch
oklch(77.4% 0.104 77.7)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#8B7978

Crimson · Gray · Warm Gray

HEX
#8B7978
RGB
rgb(139, 121, 120)
HSL
hsl(3, 8%, 51%)
HSB
hsb(3, 14%, 55%)
CMYK
cmyk(0%, 13%, 14%, 45%)
Oklch
oklch(59.2% 0.022 21.6)

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

#C40519

Vermilion · FireBrick · Wine Red

HEX
#C40519
RGB
rgb(196, 5, 25)
HSL
hsl(354, 95%, 39%)
HSB
hsb(354, 97%, 77%)
CMYK
cmyk(0%, 97%, 87%, 23%)
Oklch
oklch(51.8% 0.209 26.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

21220F
111023

Analogous

231A10
21220F
192310

Triadic

21220F
102223
231022

Split-Comp.

21220F
101923
1A1023

Tetradic

21220F
10231A
111023
231019

Contrast Matrix WCAG 2.1 Contrast

21220F
C7BEB4
DAAD66
8B7978
C40519
—
8.8
AAA
7.8
AAA
3.9
AA Large
2.6
Fail
8.8
AAA
—
1.1
Fail
2.2
Fail
3.4
AA Large
7.8
AAA
1.1
Fail
—
2.0
Fail
3.0
AA Large
3.9
AA Large
2.2
Fail
2.0
Fail
—
1.5
Fail
2.6
Fail
3.4
AA Large
3.0
AA Large
1.5
Fail
—
White BG
16.1AAA
1.8Fail
2.1Fail
4.1AA Large
6.2AA
Black BG
1.3Fail
11.5AAA
10.2AAA
5.1AA
3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

212114
C3C3B6
C7C677
838378
717014

Deuteranopia

212115
C4C4B7
C9CD7B
848678
7C8B13

Tritanopia

211718
C7B8B9
D88588
8A7878
BA1010

Achromatopsia

202020
C0C0C0
B2B2B2
7E7E7E
404040

Shades & Tints Shades & Tints

#21220F

Dark
Light

#C7BEB4

Dark
Light

#DAAD66

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #21220f;
  --color-2: #c7beb4;
  --color-3: #daad66;
  --color-4: #8b7978;
  --color-5: #c40519;
}

SCSS

$color-1: #21220f;
$color-2: #c7beb4;
$color-3: #daad66;
$color-4: #8b7978;
$color-5: #c40519;

TAILWIND

colors: {
  'brand-1': '#21220f',
  'brand-2': '#c7beb4',
  'brand-3': '#daad66',
  'brand-4': '#8b7978',
  'brand-5': '#c40519',
}

RGB Array

[33, 34, 15], [199, 190, 180], [218, 173, 102], [139, 121, 120], [196, 5, 25]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #21220F, #C7BEB4, #DAAD66, #8B7978, #C40519 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: #21220f; --color-2: #c7beb4; --color-3: #daad66; --color-4: #8b7978; --color-5: #c40519. 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