← Back to Editor

#32090F · #DC2718 · #D68124 · #CFB637 · #CCB4AE

earth

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#32090F

Vermilion · Black · Deep Berry

HEX
#32090F
RGB
rgb(50, 9, 15)
HSL
hsl(351, 69%, 12%)
HSB
hsb(351, 82%, 20%)
CMYK
cmyk(0%, 82%, 70%, 80%)
Oklch
oklch(21.7% 0.066 16.2)

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

#DC2718

Vermilion · Crimson · Passion Red

HEX
#DC2718
RGB
rgb(220, 39, 24)
HSL
hsl(5, 80%, 48%)
HSB
hsb(5, 89%, 86%)
CMYK
cmyk(0%, 82%, 89%, 14%)
Oklch
oklch(57.7% 0.216 29.9)

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

#D68124

Ochre · Chocolate · Amber Brown

HEX
#D68124
RGB
rgb(214, 129, 36)
HSL
hsl(31, 71%, 49%)
HSB
hsb(31, 83%, 84%)
CMYK
cmyk(0%, 40%, 83%, 16%)
Oklch
oklch(68.0% 0.144 62.1)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#CFB637

Autumn Sage · GoldenRod · Sunflower

HEX
#CFB637
RGB
rgb(207, 182, 55)
HSL
hsl(50, 61%, 51%)
HSB
hsb(50, 73%, 81%)
CMYK
cmyk(0%, 12%, 73%, 19%)
Oklch
oklch(77.6% 0.143 97.6)

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

#CCB4AE

Peach Pink · Silver · Coral Red

HEX
#CCB4AE
RGB
rgb(204, 180, 174)
HSL
hsl(12, 23%, 74%)
HSB
hsb(12, 15%, 80%)
CMYK
cmyk(0%, 12%, 15%, 20%)
Oklch
oklch(78.9% 0.029 34.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

32090F
09342D

Analogous

340925
32090F
341809

Triadic

32090F
103409
091034

Split-Comp.

32090F
093418
092534

Tetradic

32090F
253409
09342D
180934

Contrast Matrix WCAG 2.1 Contrast

32090F
DC2718
D68124
CFB637
CCB4AE
—
3.7
AA Large
5.9
AA
8.8
AAA
9.1
AAA
3.7
AA Large
—
1.6
Fail
2.4
Fail
2.5
Fail
5.9
AA
1.6
Fail
—
1.5
Fail
1.5
Fail
8.8
AAA
2.4
Fail
1.5
Fail
—
1.0
Fail
9.1
AAA
2.5
Fail
1.5
Fail
1.0
Fail
—
White BG
17.8AAA
4.8AA
3.0Fail
2.0Fail
2.0Fail
Black BG
1.2Fail
4.3AA Large
7.0AAA
10.4AAA
10.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

20200E
8E8C1C
B1B03B
C4C456
C2C1AF

Deuteranopia

23260D
98A61C
B6BC40
C6C75D
C3C5B0

Tritanopia

300C0C
D31E1F
D24C50
CE6E73
CBB1B1

Achromatopsia

161616
5B5B5B
909090
AFAFAF
BABABA

Shades & Tints Shades & Tints

#32090F

Dark
Light

#DC2718

Dark
Light

#D68124

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #32090f;
  --color-2: #dc2718;
  --color-3: #d68124;
  --color-4: #cfb637;
  --color-5: #ccb4ae;
}

SCSS

$color-1: #32090f;
$color-2: #dc2718;
$color-3: #d68124;
$color-4: #cfb637;
$color-5: #ccb4ae;

TAILWIND

colors: {
  'brand-1': '#32090f',
  'brand-2': '#dc2718',
  'brand-3': '#d68124',
  'brand-4': '#cfb637',
  'brand-5': '#ccb4ae',
}

RGB Array

[50, 9, 15], [220, 39, 24], [214, 129, 36], [207, 182, 55], [204, 180, 174]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #32090F, #DC2718, #D68124, #CFB637, #CCB4AE is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #32090f; --color-2: #dc2718; --color-3: #d68124; --color-4: #cfb637; --color-5: #ccb4ae. 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 earth-style 5-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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