← Back to Editor

#E52501 · #F96D18 · #DBB341 · #B9D09C · #C3EACF

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 App

Color Details Color Details

#E52501

Vermilion · OrangeRed · Passion Red

HEX
#E52501
RGB
rgb(229, 37, 1)
HSL
hsl(9, 99%, 45%)
HSB
hsb(9, 100%, 90%)
CMYK
cmyk(0%, 84%, 100%, 10%)
Oklch
oklch(59.1% 0.226 31.6)

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

#F96D18

Tangerine · Chocolate · Warm Sun

HEX
#F96D18
RGB
rgb(249, 109, 24)
HSL
hsl(23, 95%, 54%)
HSB
hsb(23, 90%, 98%)
CMYK
cmyk(0%, 56%, 90%, 2%)
Oklch
oklch(69.7% 0.191 45.1)

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

#DBB341

Ginger · GoldenRod · Sunflower

HEX
#DBB341
RGB
rgb(219, 179, 65)
HSL
hsl(44, 68%, 56%)
HSB
hsb(44, 70%, 86%)
CMYK
cmyk(0%, 18%, 70%, 14%)
Oklch
oklch(78.2% 0.136 89.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#B9D09C

Willow Green · Silver · Apple Green

HEX
#B9D09C
RGB
rgb(185, 208, 156)
HSL
hsl(87, 36%, 71%)
HSB
hsb(87, 25%, 82%)
CMYK
cmyk(11%, 0%, 25%, 18%)
Oklch
oklch(82.7% 0.074 127.3)

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

#C3EACF

Celadon · LightGray · Mint Green

HEX
#C3EACF
RGB
rgb(195, 234, 207)
HSL
hsl(138, 48%, 84%)
HSB
hsb(138, 17%, 92%)
CMYK
cmyk(17%, 0%, 12%, 8%)
Oklch
oklch(90.2% 0.055 155.0)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E52501
01C2E4

Analogous

E40151
E52501
E49501

Triadic

E52501
01E423
2301E4

Split-Comp.

E52501
01E495
0151E4

Tetradic

E52501
51E401
01C2E4
9501E4

Contrast Matrix WCAG 2.1 Contrast

E52501
F96D18
DBB341
B9D09C
C3EACF
—
1.6
Fail
2.3
Fail
2.7
Fail
3.5
AA Large
1.6
Fail
—
1.5
Fail
1.7
Fail
2.2
Fail
2.3
Fail
1.5
Fail
—
1.2
Fail
1.5
Fail
2.7
Fail
1.7
Fail
1.2
Fail
—
1.3
Fail
3.5
AA Large
2.2
Fail
1.5
Fail
1.3
Fail
—
White BG
4.6AA
2.9Fail
2.0Fail
1.7Fail
1.3Fail
Black BG
4.6AA
7.2AAA
10.5AAA
12.6AAA
16.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

92900A
BCBB2D
CAC95D
C3C3A9
D4D4D6

Deuteranopia

9DAB0C
C5CF31
CCCF63
C2C0AC
D2CFD7

Tritanopia

DB1112
F23D40
D97277
BAB3B5
C5DBDC

Achromatopsia

5A5A5A
8D8D8D
B2B2B2
C3C3C3
DBDBDB

Shades & Tints Shades & Tints

#E52501

Dark
Light

#F96D18

Dark
Light

#DBB341

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e52501;
  --color-2: #f96d18;
  --color-3: #dbb341;
  --color-4: #b9d09c;
  --color-5: #c3eacf;
}

SCSS

$color-1: #e52501;
$color-2: #f96d18;
$color-3: #dbb341;
$color-4: #b9d09c;
$color-5: #c3eacf;

TAILWIND

colors: {
  'brand-1': '#e52501',
  'brand-2': '#f96d18',
  'brand-3': '#dbb341',
  'brand-4': '#b9d09c',
  'brand-5': '#c3eacf',
}

RGB Array

[229, 37, 1], [249, 109, 24], [219, 179, 65], [185, 208, 156], [195, 234, 207]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #E52501, #F96D18, #DBB341, #B9D09C, #C3EACF is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #e52501; --color-2: #f96d18; --color-3: #dbb341; --color-4: #b9d09c; --color-5: #c3eacf. 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. 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