← Back to Editor

#CD431D · #FF7800 · #FFC000 · #E5C923 · #7C9E68

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 App

Color Details Color Details

#CD431D

Vermilion · Chocolate · Passion Red

HEX
#CD431D
RGB
rgb(205, 67, 29)
HSL
hsl(13, 75%, 46%)
HSB
hsb(13, 86%, 80%)
CMYK
cmyk(0%, 67%, 86%, 20%)
Oklch
oklch(57.5% 0.181 35.5)

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

#FF7800

Tangerine · Orange · Amber Brown

HEX
#FF7800
RGB
rgb(255, 120, 0)
HSL
hsl(28, 100%, 50%)
HSB
hsb(28, 100%, 100%)
CMYK
cmyk(0%, 53%, 100%, 0%)
Oklch
oklch(72.0% 0.191 49.8)

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

#FFC000

Ochre · Gold · Honey Gold

HEX
#FFC000
RGB
rgb(255, 192, 0)
HSL
hsl(45, 100%, 50%)
HSB
hsb(45, 100%, 100%)
CMYK
cmyk(0%, 25%, 100%, 0%)
Oklch
oklch(84.2% 0.173 84.6)

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

#E5C923

Autumn Sage · GoldenRod · Sunflower

HEX
#E5C923
RGB
rgb(229, 201, 35)
HSL
hsl(51, 79%, 52%)
HSB
hsb(51, 85%, 90%)
CMYK
cmyk(0%, 12%, 85%, 10%)
Oklch
oklch(83.5% 0.166 98.5)

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

#7C9E68

Celadon · Gray · Olive Green

HEX
#7C9E68
RGB
rgb(124, 158, 104)
HSL
hsl(98, 22%, 51%)
HSB
hsb(98, 34%, 62%)
CMYK
cmyk(22%, 0%, 34%, 38%)
Oklch
oklch(66.0% 0.086 134.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CD431D
1DA7CD

Analogous

CD1D4F
CD431D
CD9B1D

Triadic

CD431D
1DCD43
431DCD

Split-Comp.

CD431D
1DCD9B
1D4FCD

Tetradic

CD431D
4FCD1D
1DA7CD
9B1DCD

Contrast Matrix WCAG 2.1 Contrast

CD431D
FF7800
FFC000
E5C923
7C9E68
—
1.8
Fail
2.9
Fail
2.9
Fail
1.6
Fail
1.8
Fail
—
1.6
Fail
1.6
Fail
1.1
Fail
2.9
Fail
1.6
Fail
—
1.0
Fail
1.8
Fail
2.9
Fail
1.6
Fail
1.0
Fail
—
1.8
Fail
1.6
Fail
1.1
Fail
1.8
Fail
1.8
Fail
—
White BG
4.8AA
2.6Fail
1.6Fail
1.7Fail
3.0AA Large
Black BG
4.4AA Large
7.9AAA
12.8AAA
12.7AAA
6.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

919026
C5C31D
E4E32E
D9D94B
8B8B75

Deuteranopia

99A428
CCD724
E7EC3A
DBDD55
898678

Tritanopia

C62D2F
F83439
FC535B
E46B72
7E7F82

Achromatopsia

686868
939393
BDBDBD
BEBEBE
8E8E8E

Shades & Tints Shades & Tints

#CD431D

Dark
Light

#FF7800

Dark
Light

#FFC000

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cd431d;
  --color-2: #ff7800;
  --color-3: #ffc000;
  --color-4: #e5c923;
  --color-5: #7c9e68;
}

SCSS

$color-1: #cd431d;
$color-2: #ff7800;
$color-3: #ffc000;
$color-4: #e5c923;
$color-5: #7c9e68;

TAILWIND

colors: {
  'brand-1': '#cd431d',
  'brand-2': '#ff7800',
  'brand-3': '#ffc000',
  'brand-4': '#e5c923',
  'brand-5': '#7c9e68',
}

RGB Array

[205, 67, 29], [255, 120, 0], [255, 192, 0], [229, 201, 35], [124, 158, 104]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #CD431D, #FF7800, #FFC000, #E5C923, #7C9E68 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #cd431d; --color-2: #ff7800; --color-3: #ffc000; --color-4: #e5c923; --color-5: #7c9e68. 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. 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