← Back to Editor

#E9E1D6 · #987562 · #5F4136 · #0B4B4A · #05121A

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

#E9E1D6

Goose Yellow · Beige · Peach Orange

HEX
#E9E1D6
RGB
rgb(233, 225, 214)
HSL
hsl(35, 30%, 88%)
HSB
hsb(35, 8%, 91%)
CMYK
cmyk(0%, 3%, 8%, 9%)
Oklch
oklch(91.3% 0.017 76.1)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#987562

Tangerine · Gray · Amber Brown

HEX
#987562
RGB
rgb(152, 117, 98)
HSL
hsl(21, 22%, 49%)
HSB
hsb(21, 36%, 60%)
CMYK
cmyk(0%, 23%, 36%, 40%)
Oklch
oklch(59.2% 0.052 49.8)

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

#5F4136

Tangerine · DarkOliveGreen · Amber Brown

HEX
#5F4136
RGB
rgb(95, 65, 54)
HSL
hsl(16, 28%, 29%)
HSB
hsb(16, 43%, 37%)
CMYK
cmyk(0%, 32%, 43%, 63%)
Oklch
oklch(40.6% 0.046 41.0)

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

#0B4B4A

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#0B4B4A
RGB
rgb(11, 75, 74)
HSL
hsl(179, 74%, 17%)
HSB
hsb(179, 85%, 29%)
CMYK
cmyk(85%, 0%, 1%, 71%)
Oklch
oklch(37.5% 0.060 193.3)

Traditional「Mineral Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#05121A

Lake Blue · Black · Deep Sea Blue

HEX
#05121A
RGB
rgb(5, 18, 26)
HSL
hsl(203, 68%, 6%)
HSB
hsb(203, 81%, 10%)
CMYK
cmyk(81%, 31%, 0%, 90%)
Oklch
oklch(17.4% 0.026 235.8)

Traditional「Lake Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E9E1D6
D7DFEA

Analogous

EAD9D7
E9E1D6
E8EAD7

Triadic

E9E1D6
D7EAE2
E2D7EA

Split-Comp.

E9E1D6
D7E8EA
D9D7EA

Tetradic

E9E1D6
D7EAD9
D7DFEA
EAD7E8

Contrast Matrix WCAG 2.1 Contrast

E9E1D6
987562
5F4136
0B4B4A
05121A
—
3.2
AA Large
7.1
AAA
7.6
AAA
14.6
AAA
3.2
AA Large
—
2.2
Fail
2.4
Fail
4.6
AA
7.1
AAA
2.2
Fail
—
1.1
Fail
2.1
Fail
7.6
AAA
2.4
Fail
1.1
Fail
—
1.9
Fail
14.6
AAA
4.6
AA
2.1
Fail
1.9
Fail
—
White BG
1.3Fail
4.2AA Large
9.1AAA
9.9AAA
19.0AAA
Black BG
16.2AAA
5.1AA
2.3Fail
2.1Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E6E5D9
898967
525239
27274A
0B0B18

Deuteranopia

E6E7D9
8B8E68
545639
231E4A
0A0918

Tritanopia

E9DBDB
966A6B
5E3B3B
0E4A4A
061716

Achromatopsia

E2E2E2
7D7D7D
494949
383838
0F0F0F

Shades & Tints Shades & Tints

#E9E1D6

Dark
Light

#987562

Dark
Light

#5F4136

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e9e1d6;
  --color-2: #987562;
  --color-3: #5f4136;
  --color-4: #0b4b4a;
  --color-5: #05121a;
}

SCSS

$color-1: #e9e1d6;
$color-2: #987562;
$color-3: #5f4136;
$color-4: #0b4b4a;
$color-5: #05121a;

TAILWIND

colors: {
  'brand-1': '#e9e1d6',
  'brand-2': '#987562',
  'brand-3': '#5f4136',
  'brand-4': '#0b4b4a',
  'brand-5': '#05121a',
}

RGB Array

[233, 225, 214], [152, 117, 98], [95, 65, 54], [11, 75, 74], [5, 18, 26]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #E9E1D6, #987562, #5F4136, #0B4B4A, #05121A is ideal for: tech websites, dark mode UIs, game UIs, 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: #e9e1d6; --color-2: #987562; --color-3: #5f4136; --color-4: #0b4b4a; --color-5: #05121a. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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