← Back to Editor

#E52233 · #585054 · #02A674 · #8AD146 · #D6D462

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 App

Color Details Color Details

#E52233

Vermilion · Crimson · Passion Red

HEX
#E52233
RGB
rgb(229, 34, 51)
HSL
hsl(355, 79%, 52%)
HSB
hsb(355, 85%, 90%)
CMYK
cmyk(0%, 85%, 78%, 10%)
Oklch
oklch(59.3% 0.224 24.2)

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

#585054

Ink Gray · DimGray · Charcoal

HEX
#585054
RGB
rgb(88, 80, 84)
HSL
hsl(330, 5%, 33%)
HSB
hsb(330, 9%, 35%)
CMYK
cmyk(0%, 9%, 5%, 65%)
Oklch
oklch(44.0% 0.012 345.9)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#02A674

Mineral Blue · Teal · Mint Ice

HEX
#02A674
RGB
rgb(2, 166, 116)
HSL
hsl(162, 98%, 33%)
HSB
hsb(162, 99%, 65%)
CMYK
cmyk(99%, 0%, 30%, 35%)
Oklch
oklch(64.2% 0.138 163.0)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#8AD146

Emerald · GreenYellow · Olive Green

HEX
#8AD146
RGB
rgb(138, 209, 70)
HSL
hsl(91, 60%, 55%)
HSB
hsb(91, 67%, 82%)
CMYK
cmyk(34%, 0%, 67%, 18%)
Oklch
oklch(78.6% 0.184 132.5)

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

#D6D462

Fresh Green · BurlyWood · Sunflower

HEX
#D6D462
RGB
rgb(214, 212, 98)
HSL
hsl(59, 59%, 61%)
HSB
hsb(59, 54%, 84%)
CMYK
cmyk(0%, 1%, 54%, 16%)
Oklch
oklch(84.9% 0.136 108.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E52233
24E5D5

Analogous

E52495
E52233
E57424

Triadic

E52233
34E524
2434E5

Split-Comp.

E52233
24E574
2495E5

Tetradic

E52233
95E524
24E5D5
7424E5

Contrast Matrix WCAG 2.1 Contrast

E52233
585054
02A674
8AD146
D6D462
—
1.7
Fail
1.5
Fail
2.4
Fail
2.9
Fail
1.7
Fail
—
2.5
Fail
4.2
AA Large
5.0
AA
1.5
Fail
2.5
Fail
—
1.7
Fail
2.0
Fail
2.4
Fail
4.2
AA Large
1.7
Fail
—
1.2
Fail
2.9
Fail
5.0
AA
2.0
Fail
1.2
Fail
—
White BG
4.6AA
7.8AAA
3.1AA Large
1.9Fail
1.6Fail
Black BG
4.6AA
2.7Fail
6.7AA
11.3AAA
13.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

918F2F
555453
494A80
A9A968
D5D57E

Deuteranopia

9CAA2E
555653
403383
A59F70
D5D584

Tritanopia

DB2C2B
585252
0A8A8C
8E8288
D69398

Achromatopsia

5E5E5E
535353
6F6F6F
ACACAC
C8C8C8

Shades & Tints Shades & Tints

#E52233

Dark
Light

#585054

Dark
Light

#02A674

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e52233;
  --color-2: #585054;
  --color-3: #02a674;
  --color-4: #8ad146;
  --color-5: #d6d462;
}

SCSS

$color-1: #e52233;
$color-2: #585054;
$color-3: #02a674;
$color-4: #8ad146;
$color-5: #d6d462;

TAILWIND

colors: {
  'brand-1': '#e52233',
  'brand-2': '#585054',
  'brand-3': '#02a674',
  'brand-4': '#8ad146',
  'brand-5': '#d6d462',
}

RGB Array

[229, 34, 51], [88, 80, 84], [2, 166, 116], [138, 209, 70], [214, 212, 98]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #E52233, #585054, #02A674, #8AD146, #D6D462 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: #e52233; --color-2: #585054; --color-3: #02a674; --color-4: #8ad146; --color-5: #d6d462. 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