← Back to Editor

#FFFBE8 · #D8D890 · #B7C90E · #E95D12 · #AC021F

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

#FFFBE8

Fresh Green · SeaShell · Lemon Cream

HEX
#FFFBE8
RGB
rgb(255, 251, 232)
HSL
hsl(50, 100%, 95%)
HSB
hsb(50, 9%, 100%)
CMYK
cmyk(0%, 2%, 9%, 0%)
Oklch
oklch(98.6% 0.025 97.1)

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

#D8D890

Fresh Green · Khaki · Sunflower

HEX
#D8D890
RGB
rgb(216, 216, 144)
HSL
hsl(60, 48%, 71%)
HSB
hsb(60, 33%, 85%)
CMYK
cmyk(0%, 0%, 33%, 15%)
Oklch
oklch(86.6% 0.093 108.2)

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

#B7C90E

Autumn Sage · GoldenRod · Honey Gold

HEX
#B7C90E
RGB
rgb(183, 201, 14)
HSL
hsl(66, 87%, 42%)
HSB
hsb(66, 93%, 79%)
CMYK
cmyk(9%, 0%, 93%, 21%)
Oklch
oklch(79.5% 0.180 116.1)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#E95D12

Tangerine · Chocolate · Amber Brown

HEX
#E95D12
RGB
rgb(233, 93, 18)
HSL
hsl(21, 86%, 49%)
HSB
hsb(21, 92%, 91%)
CMYK
cmyk(0%, 60%, 92%, 9%)
Oklch
oklch(65.1% 0.189 42.4)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#AC021F

Vermilion · FireBrick · Wine Red

HEX
#AC021F
RGB
rgb(172, 2, 31)
HSL
hsl(350, 98%, 34%)
HSB
hsb(350, 99%, 67%)
CMYK
cmyk(0%, 99%, 82%, 33%)
Oklch
oklch(47.0% 0.189 23.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFFBE8
E5EAFF

Analogous

FFEEE5
FFFBE8
F7FFE5

Triadic

FFFBE8
E5FFFB
FBE5FF

Split-Comp.

FFFBE8
E5F6FF
EEE5FF

Tetradic

FFFBE8
E5FFEE
E5EAFF
FFE5F7

Contrast Matrix WCAG 2.1 Contrast

FFFBE8
D8D890
B7C90E
E95D12
AC021F
—
1.4
Fail
1.8
Fail
3.3
AA Large
7.3
AAA
1.4
Fail
—
1.2
Fail
2.3
Fail
5.1
AA
1.8
Fail
1.2
Fail
—
1.9
Fail
4.1
AA Large
3.3
AA Large
2.3
Fail
1.9
Fail
—
2.2
Fail
7.3
AAA
5.1
AA
4.1
AA Large
2.2
Fail
—
White BG
1.0Fail
1.5Fail
1.8Fail
3.5AA Large
7.5AAA
Black BG
20.2AAA
14.1AAA
11.4AAA
6.0AA
2.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FDFDED
D8D8A1
BFBF3B
ACAB24
626118

Deuteranopia

FEFEEE
D8D8A6
BEBC46
B5BF29
6C7916

Tritanopia

FFF0F1
D8AFB2
B85F67
E23236
A41211

Achromatopsia

FAFAFA
D0D0D0
AEAEAE
7E7E7E
383838

Shades & Tints Shades & Tints

#FFFBE8

Dark
Light

#D8D890

Dark
Light

#B7C90E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fffbe8;
  --color-2: #d8d890;
  --color-3: #b7c90e;
  --color-4: #e95d12;
  --color-5: #ac021f;
}

SCSS

$color-1: #fffbe8;
$color-2: #d8d890;
$color-3: #b7c90e;
$color-4: #e95d12;
$color-5: #ac021f;

TAILWIND

colors: {
  'brand-1': '#fffbe8',
  'brand-2': '#d8d890',
  'brand-3': '#b7c90e',
  'brand-4': '#e95d12',
  'brand-5': '#ac021f',
}

RGB Array

[255, 251, 232], [216, 216, 144], [183, 201, 14], [233, 93, 18], [172, 2, 31]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #FFFBE8, #D8D890, #B7C90E, #E95D12, #AC021F 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: #fffbe8; --color-2: #d8d890; --color-3: #b7c90e; --color-4: #e95d12; --color-5: #ac021f. 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