← Back to Editor

#F0D9B0 · #EACF9A · #C9A362 · #BA0703 · #58451A

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

VibrantFreshWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Landing PageMobile AppData Visualization

Color Details Color Details

#F0D9B0

Goose Yellow · Wheat · Peach Orange

HEX
#F0D9B0
RGB
rgb(240, 217, 176)
HSL
hsl(38, 68%, 82%)
HSB
hsb(38, 27%, 94%)
CMYK
cmyk(0%, 10%, 27%, 6%)
Oklch
oklch(89.4% 0.059 82.0)

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

#EACF9A

Goose Yellow · Khaki · Lemon Cream

HEX
#EACF9A
RGB
rgb(234, 207, 154)
HSL
hsl(40, 66%, 76%)
HSB
hsb(40, 34%, 92%)
CMYK
cmyk(0%, 12%, 34%, 8%)
Oklch
oklch(86.5% 0.075 83.9)

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

#C9A362

Ginger · DarkSalmon · Warm Sun

HEX
#C9A362
RGB
rgb(201, 163, 98)
HSL
hsl(38, 49%, 59%)
HSB
hsb(38, 51%, 79%)
CMYK
cmyk(0%, 19%, 51%, 21%)
Oklch
oklch(73.6% 0.095 79.9)

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

#BA0703

Vermilion · FireBrick · Wine Red

HEX
#BA0703
RGB
rgb(186, 7, 3)
HSL
hsl(1, 97%, 37%)
HSB
hsb(1, 98%, 73%)
CMYK
cmyk(0%, 96%, 98%, 27%)
Oklch
oklch(49.7% 0.201 29.3)

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

#58451A

Ochre · DarkOliveGreen · Amber Gold

HEX
#58451A
RGB
rgb(88, 69, 26)
HSL
hsl(42, 54%, 22%)
HSB
hsb(42, 70%, 35%)
CMYK
cmyk(0%, 22%, 70%, 65%)
Oklch
oklch(40.1% 0.065 85.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0D9B0
B2C9F0

Analogous

F0BAB2
F0D9B0
E8F0B2

Triadic

F0D9B0
B2F0D9
D9B2F0

Split-Comp.

F0D9B0
B2E8F0
BAB2F0

Tetradic

F0D9B0
B2F0BA
B2C9F0
F0B2E8

Contrast Matrix WCAG 2.1 Contrast

F0D9B0
EACF9A
C9A362
BA0703
58451A
—
1.1
Fail
1.7
Fail
4.9
AA
6.7
AA
1.1
Fail
—
1.6
Fail
4.5
AA Large
6.1
AA
1.7
Fail
1.6
Fail
—
2.9
Fail
3.9
AA Large
4.9
AA
4.5
AA Large
2.9
Fail
—
1.4
Fail
6.7
AA
6.1
AA
3.9
AA Large
1.4
Fail
—
White BG
1.4Fail
1.5Fail
2.4Fail
6.7AA
9.2AAA
Black BG
15.3AAA
13.9AAA
8.9AAA
3.1AA Large
2.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E6E6BA
DEDEA7
B9B872
6C6B04
505024

Deuteranopia

E7E9BC
E0E2AA
BBBE76
778404
515227

Tritanopia

EFC2C3
E9B1B3
C77E81
B10505
572D2E

Achromatopsia

DBDBDB
D1D1D1
A7A7A7
3C3C3C
464646

Shades & Tints Shades & Tints

#F0D9B0

Dark
Light

#EACF9A

Dark
Light

#C9A362

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0d9b0;
  --color-2: #eacf9a;
  --color-3: #c9a362;
  --color-4: #ba0703;
  --color-5: #58451a;
}

SCSS

$color-1: #f0d9b0;
$color-2: #eacf9a;
$color-3: #c9a362;
$color-4: #ba0703;
$color-5: #58451a;

TAILWIND

colors: {
  'brand-1': '#f0d9b0',
  'brand-2': '#eacf9a',
  'brand-3': '#c9a362',
  'brand-4': '#ba0703',
  'brand-5': '#58451a',
}

RGB Array

[240, 217, 176], [234, 207, 154], [201, 163, 98], [186, 7, 3], [88, 69, 26]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #F0D9B0, #EACF9A, #C9A362, #BA0703, #58451A is ideal for: social media posters, mobile apps, e-commerce promos, 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: #f0d9b0; --color-2: #eacf9a; --color-3: #c9a362; --color-4: #ba0703; --color-5: #58451a. 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 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