← Back to Editor

#E3D29F · #D6BA67 · #1D5442 · #0F3327 · #170114

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

VibrantFreshWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Landing PageMobile AppData Visualization

Color Details Color Details

#E3D29F

Goose Yellow · Wheat · Lemon Cream

HEX
#E3D29F
RGB
rgb(227, 210, 159)
HSL
hsl(45, 55%, 76%)
HSB
hsb(45, 30%, 89%)
CMYK
cmyk(0%, 7%, 30%, 11%)
Oklch
oklch(86.5% 0.069 91.8)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#D6BA67

Ginger · BurlyWood · Sunflower

HEX
#D6BA67
RGB
rgb(214, 186, 103)
HSL
hsl(45, 58%, 62%)
HSB
hsb(45, 52%, 84%)
CMYK
cmyk(0%, 13%, 52%, 16%)
Oklch
oklch(79.6% 0.108 91.2)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#1D5442

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#1D5442
RGB
rgb(29, 84, 66)
HSL
hsl(160, 49%, 22%)
HSB
hsb(160, 65%, 33%)
CMYK
cmyk(65%, 0%, 21%, 67%)
Oklch
oklch(40.4% 0.066 168.2)

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

#0F3327

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#0F3327
RGB
rgb(15, 51, 39)
HSL
hsl(160, 55%, 13%)
HSB
hsb(160, 71%, 20%)
CMYK
cmyk(71%, 0%, 24%, 80%)
Oklch
oklch(29.1% 0.047 168.0)

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

#170114

Rose Purple · Black · Dark Purple

HEX
#170114
RGB
rgb(23, 1, 20)
HSL
hsl(308, 92%, 5%)
HSB
hsb(308, 96%, 9%)
CMYK
cmyk(0%, 96%, 13%, 91%)
Oklch
oklch(14.4% 0.059 333.3)

Traditional「Rose Purple」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E3D29F
A0B1E3

Analogous

E3B1A0
E3D29F
D3E3A0

Triadic

E3D29F
A0E3D3
D3A0E3

Split-Comp.

E3D29F
A0D3E3
B1A0E3

Tetradic

E3D29F
A0E3B1
A0B1E3
E3A0D3

Contrast Matrix WCAG 2.1 Contrast

E3D29F
D6BA67
1D5442
0F3327
170114
—
1.3
Fail
5.8
AA
9.2
AAA
13.3
AAA
1.3
Fail
—
4.6
AA
7.3
AAA
10.5
AAA
5.8
AA
4.6
AA
—
1.6
Fail
2.3
Fail
9.2
AAA
7.3
AAA
1.6
Fail
—
1.4
Fail
13.3
AAA
10.5
AAA
2.3
Fail
1.4
Fail
—
White BG
1.5Fail
1.9Fail
8.8AAA
13.8AAA
20.0AAA
Black BG
14.0AAA
11.1AAA
2.4Fail
1.5Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DCDBAB
CACA7B
353546
1F1F2A
0D0D0F

Deuteranopia

DDDEAE
CCCE80
322E47
1D1A2B
0F100E

Tritanopia

E2B5B7
D58B8E
204A4B
112C2D
160C0B

Achromatopsia

D1D1D1
B9B9B9
424242
272727
0A0A0A

Shades & Tints Shades & Tints

#E3D29F

Dark
Light

#D6BA67

Dark
Light

#1D5442

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e3d29f;
  --color-2: #d6ba67;
  --color-3: #1d5442;
  --color-4: #0f3327;
  --color-5: #170114;
}

SCSS

$color-1: #e3d29f;
$color-2: #d6ba67;
$color-3: #1d5442;
$color-4: #0f3327;
$color-5: #170114;

TAILWIND

colors: {
  'brand-1': '#e3d29f',
  'brand-2': '#d6ba67',
  'brand-3': '#1d5442',
  'brand-4': '#0f3327',
  'brand-5': '#170114',
}

RGB Array

[227, 210, 159], [214, 186, 103], [29, 84, 66], [15, 51, 39], [23, 1, 20]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #E3D29F, #D6BA67, #1D5442, #0F3327, #170114 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, 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: #e3d29f; --color-2: #d6ba67; --color-3: #1d5442; --color-4: #0f3327; --color-5: #170114. 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 nature-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