← Back to Editor

#DDD8A5 · #FFAD29 · #82AB4D · #3E7054 · #3B362C

earth

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

#DDD8A5

Fresh Green · Wheat · Lemon Cream

HEX
#DDD8A5
RGB
rgb(221, 216, 165)
HSL
hsl(55, 45%, 76%)
HSB
hsb(55, 25%, 87%)
CMYK
cmyk(0%, 2%, 25%, 13%)
Oklch
oklch(87.4% 0.067 103.0)

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

#FFAD29

Ginger · GoldenRod · Warm Sun

HEX
#FFAD29
RGB
rgb(255, 173, 41)
HSL
hsl(37, 100%, 58%)
HSB
hsb(37, 84%, 100%)
CMYK
cmyk(0%, 32%, 84%, 0%)
Oklch
oklch(80.8% 0.162 72.6)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#82AB4D

Grass Green · Gray · Olive Green

HEX
#82AB4D
RGB
rgb(130, 171, 77)
HSL
hsl(86, 38%, 49%)
HSB
hsb(86, 55%, 67%)
CMYK
cmyk(24%, 0%, 55%, 33%)
Oklch
oklch(69.1% 0.132 129.0)

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

#3E7054

Celadon · SeaGreen · Forest Green

HEX
#3E7054
RGB
rgb(62, 112, 84)
HSL
hsl(146, 29%, 34%)
HSB
hsb(146, 45%, 44%)
CMYK
cmyk(45%, 0%, 25%, 56%)
Oklch
oklch(50.1% 0.071 158.0)

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

#3B362C

Ochre · DarkSlateGray · Amber Gold

HEX
#3B362C
RGB
rgb(59, 54, 44)
HSL
hsl(40, 15%, 20%)
HSB
hsb(40, 25%, 23%)
CMYK
cmyk(0%, 8%, 25%, 77%)
Oklch
oklch(33.5% 0.018 84.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DDD8A5
A6ABDD

Analogous

DDBDA6
DDD8A5
C6DDA6

Triadic

DDD8A5
A6DDD9
D9A6DD

Split-Comp.

DDD8A5
A6C6DD
BDA6DD

Tetradic

DDD8A5
A6DDBD
A6ABDD
DDA6C6

Contrast Matrix WCAG 2.1 Contrast

DDD8A5
FFAD29
82AB4D
3E7054
3B362C
—
1.3
Fail
1.8
Fail
4.0
AA Large
8.3
AAA
1.3
Fail
—
1.4
Fail
3.1
AA Large
6.4
AA
1.8
Fail
1.4
Fail
—
2.2
Fail
4.5
AA
4.0
AA Large
3.1
AA Large
2.2
Fail
—
2.1
Fail
8.3
AAA
6.4
AA
4.5
AA
2.1
Fail
—
White BG
1.5Fail
1.9Fail
2.7Fail
5.8AA
12.0AAA
Black BG
14.4AAA
11.3AAA
7.9AAA
3.7AA Large
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DBDBB1
DBDB49
949464
54545B
39392E

Deuteranopia

DBDCB4
E0E651
918E69
514D5C
393A2F

Tritanopia

DDBBBD
FB6268
84767A
416061
3B3031

Achromatopsia

D4D4D4
B6B6B6
949494
5E5E5E
363636

Shades & Tints Shades & Tints

#DDD8A5

Dark
Light

#FFAD29

Dark
Light

#82AB4D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ddd8a5;
  --color-2: #ffad29;
  --color-3: #82ab4d;
  --color-4: #3e7054;
  --color-5: #3b362c;
}

SCSS

$color-1: #ddd8a5;
$color-2: #ffad29;
$color-3: #82ab4d;
$color-4: #3e7054;
$color-5: #3b362c;

TAILWIND

colors: {
  'brand-1': '#ddd8a5',
  'brand-2': '#ffad29',
  'brand-3': '#82ab4d',
  'brand-4': '#3e7054',
  'brand-5': '#3b362c',
}

RGB Array

[221, 216, 165], [255, 173, 41], [130, 171, 77], [62, 112, 84], [59, 54, 44]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #DDD8A5, #FFAD29, #82AB4D, #3E7054, #3B362C 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: #ddd8a5; --color-2: #ffad29; --color-3: #82ab4d; --color-4: #3e7054; --color-5: #3b362c. 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