← Back to Editor

#B8001C · #EB6579 · #D5D9CA · #94C708 · #7A9923

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

#B8001C

Vermilion · FireBrick · Wine Red

HEX
#B8001C
RGB
rgb(184, 0, 28)
HSL
hsl(351, 100%, 36%)
HSB
hsb(351, 100%, 72%)
CMYK
cmyk(0%, 100%, 85%, 28%)
Oklch
oklch(49.3% 0.200 25.0)

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

#EB6579

Peach Pink · LightCoral · Coral Red

HEX
#EB6579
RGB
rgb(235, 101, 121)
HSL
hsl(351, 77%, 66%)
HSB
hsb(351, 57%, 92%)
CMYK
cmyk(0%, 57%, 49%, 8%)
Oklch
oklch(67.8% 0.166 13.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#D5D9CA

Willow Green · LightGray · Mint Green

HEX
#D5D9CA
RGB
rgb(213, 217, 202)
HSL
hsl(76, 16%, 82%)
HSB
hsb(76, 7%, 85%)
CMYK
cmyk(2%, 0%, 7%, 15%)
Oklch
oklch(87.8% 0.021 119.0)

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

#94C708

Grass Green · Chartreuse · Olive Green

HEX
#94C708
RGB
rgb(148, 199, 8)
HSL
hsl(76, 92%, 41%)
HSB
hsb(76, 96%, 78%)
CMYK
cmyk(26%, 0%, 96%, 22%)
Oklch
oklch(76.5% 0.193 126.1)

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

#7A9923

Grass Green · Olive · Forest Green

HEX
#7A9923
RGB
rgb(122, 153, 35)
HSL
hsl(76, 63%, 37%)
HSB
hsb(76, 77%, 60%)
CMYK
cmyk(20%, 0%, 77%, 40%)
Oklch
oklch(63.7% 0.144 123.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B8001C
00B89C

Analogous

B80077
B8001C
B84000

Triadic

B8001C
1CB800
001CB8

Split-Comp.

B8001C
00B840
0077B8

Tetradic

B8001C
77B800
00B89C
4000B8

Contrast Matrix WCAG 2.1 Contrast

B8001C
EB6579
D5D9CA
94C708
7A9923
—
2.2
Fail
4.8
AA
3.4
AA Large
2.1
Fail
2.2
Fail
—
2.2
Fail
1.6
Fail
1.0
Fail
4.8
AA
2.2
Fail
—
1.4
Fail
2.3
Fail
3.4
AA Large
1.6
Fail
1.4
Fail
—
1.6
Fail
2.1
Fail
1.0
Fail
2.3
Fail
1.6
Fail
—
White BG
6.9AA
3.1AA Large
1.4Fail
2.0Fail
3.3AA Large
Black BG
3.1AA Large
6.7AA
14.6AAA
10.4AAA
6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

686715
B1B074
D7D7CE
AAAB36
878840

Deuteranopia

738114
B9C373
D7D6CE
A7A341
868346

Tritanopia

AF100F
E47070
D5D0D1
975B63
7C565B

Achromatopsia

3A3A3A
8F8F8F
D6D6D6
A2A2A2
828282

Shades & Tints Shades & Tints

#B8001C

Dark
Light

#EB6579

Dark
Light

#D5D9CA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b8001c;
  --color-2: #eb6579;
  --color-3: #d5d9ca;
  --color-4: #94c708;
  --color-5: #7a9923;
}

SCSS

$color-1: #b8001c;
$color-2: #eb6579;
$color-3: #d5d9ca;
$color-4: #94c708;
$color-5: #7a9923;

TAILWIND

colors: {
  'brand-1': '#b8001c',
  'brand-2': '#eb6579',
  'brand-3': '#d5d9ca',
  'brand-4': '#94c708',
  'brand-5': '#7a9923',
}

RGB Array

[184, 0, 28], [235, 101, 121], [213, 217, 202], [148, 199, 8], [122, 153, 35]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #B8001C, #EB6579, #D5D9CA, #94C708, #7A9923 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: #b8001c; --color-2: #eb6579; --color-3: #d5d9ca; --color-4: #94c708; --color-5: #7a9923. 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