← Back to Editor

#EB6C52 · #FFFD8A · #AFDE83 · #42A690 · #545E4B

earth

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

#EB6C52

Peach Pink · Tomato · Coral Red

HEX
#EB6C52
RGB
rgb(235, 108, 82)
HSL
hsl(10, 79%, 62%)
HSB
hsb(10, 65%, 92%)
CMYK
cmyk(0%, 54%, 65%, 8%)
Oklch
oklch(68.0% 0.163 33.1)

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

#FFFD8A

Fresh Green · Khaki · Lemon Cream

HEX
#FFFD8A
RGB
rgb(255, 253, 138)
HSL
hsl(59, 100%, 77%)
HSB
hsb(59, 46%, 100%)
CMYK
cmyk(0%, 1%, 46%, 0%)
Oklch
oklch(97.2% 0.138 107.8)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#AFDE83

Emerald · LightGreen · Apple Green

HEX
#AFDE83
RGB
rgb(175, 222, 131)
HSL
hsl(91, 58%, 69%)
HSB
hsb(91, 41%, 87%)
CMYK
cmyk(21%, 0%, 41%, 13%)
Oklch
oklch(84.7% 0.129 131.0)

Traditional「Emerald」· Paint「Apple Green」· Creative Mint Breeze

#42A690

Mineral Blue · CadetBlue · Mint Ice

HEX
#42A690
RGB
rgb(66, 166, 144)
HSL
hsl(167, 43%, 45%)
HSB
hsb(167, 60%, 65%)
CMYK
cmyk(60%, 0%, 13%, 35%)
Oklch
oklch(66.0% 0.099 176.1)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#545E4B

Celadon · DarkOliveGreen · Forest Green

HEX
#545E4B
RGB
rgb(84, 94, 75)
HSL
hsl(92, 11%, 33%)
HSB
hsb(92, 20%, 37%)
CMYK
cmyk(11%, 0%, 20%, 63%)
Oklch
oklch(46.7% 0.032 130.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EB6C52
52D1EB

Analogous

EB5285
EB6C52
EBB852

Triadic

EB6C52
52EB6B
6B52EB

Split-Comp.

EB6C52
52EBB8
5285EB

Tetradic

EB6C52
85EB52
52D1EB
B852EB

Contrast Matrix WCAG 2.1 Contrast

EB6C52
FFFD8A
AFDE83
42A690
545E4B
—
2.9
Fail
2.0
Fail
1.0
Fail
2.2
Fail
2.9
Fail
—
1.4
Fail
2.8
Fail
6.4
AA
2.0
Fail
1.4
Fail
—
1.9
Fail
4.4
AA Large
1.0
Fail
2.8
Fail
1.9
Fail
—
2.3
Fail
2.2
Fail
6.4
AA
4.4
AA Large
2.3
Fail
—
White BG
3.1AA Large
1.1Fail
1.5Fail
3.0Fail
6.8AA
Black BG
6.8AA
19.7AAA
13.6AAA
7.1AAA
3.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B358
FEFEA6
C3C499
6D6E95
585850

Deuteranopia

BBC55A
FEFEAD
C1BD9E
686097
585751

Tritanopia

E55D5E
FFBCC1
B1AAAE
479A9A
555354

Achromatopsia

8F8F8F
F0F0F0
C6C6C6
868686
595959

Shades & Tints Shades & Tints

#EB6C52

Dark
Light

#FFFD8A

Dark
Light

#AFDE83

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #eb6c52;
  --color-2: #fffd8a;
  --color-3: #afde83;
  --color-4: #42a690;
  --color-5: #545e4b;
}

SCSS

$color-1: #eb6c52;
$color-2: #fffd8a;
$color-3: #afde83;
$color-4: #42a690;
$color-5: #545e4b;

TAILWIND

colors: {
  'brand-1': '#eb6c52',
  'brand-2': '#fffd8a',
  'brand-3': '#afde83',
  'brand-4': '#42a690',
  'brand-5': '#545e4b',
}

RGB Array

[235, 108, 82], [255, 253, 138], [175, 222, 131], [66, 166, 144], [84, 94, 75]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #EB6C52, #FFFD8A, #AFDE83, #42A690, #545E4B 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: #eb6c52; --color-2: #fffd8a; --color-3: #afde83; --color-4: #42a690; --color-5: #545e4b. 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 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