← Back to Editor

#788100 · #D7021E · #FF7518 · #FCC31E · #95BA86

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

#788100

Autumn Sage · Olive · Amber Gold

HEX
#788100
RGB
rgb(120, 129, 0)
HSL
hsl(64, 100%, 25%)
HSB
hsb(64, 100%, 51%)
CMYK
cmyk(7%, 0%, 100%, 49%)
Oklch
oklch(57.6% 0.130 114.6)

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

#D7021E

Vermilion · Crimson · Passion Red

HEX
#D7021E
RGB
rgb(215, 2, 30)
HSL
hsl(352, 98%, 43%)
HSB
hsb(352, 99%, 84%)
CMYK
cmyk(0%, 99%, 86%, 16%)
Oklch
oklch(55.4% 0.224 26.0)

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

#FF7518

Tangerine · Chocolate · Warm Sun

HEX
#FF7518
RGB
rgb(255, 117, 24)
HSL
hsl(24, 100%, 55%)
HSB
hsb(24, 91%, 100%)
CMYK
cmyk(0%, 54%, 91%, 0%)
Oklch
oklch(71.6% 0.191 47.1)

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

#FCC31E

Ginger · Gold · Sunflower

HEX
#FCC31E
RGB
rgb(252, 195, 30)
HSL
hsl(45, 97%, 55%)
HSB
hsb(45, 88%, 99%)
CMYK
cmyk(0%, 23%, 88%, 1%)
Oklch
oklch(84.5% 0.168 86.4)

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

#95BA86

Celadon · DarkSeaGreen · Apple Green

HEX
#95BA86
RGB
rgb(149, 186, 134)
HSL
hsl(103, 27%, 63%)
HSB
hsb(103, 28%, 73%)
CMYK
cmyk(20%, 0%, 28%, 27%)
Oklch
oklch(74.8% 0.083 136.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

788100
080080

Analogous

804800
788100
378000

Triadic

788100
007780
800077

Split-Comp.

788100
003780
480080

Tetradic

788100
008048
080080
800037

Contrast Matrix WCAG 2.1 Contrast

788100
D7021E
FF7518
FCC31E
95BA86
—
1.3
Fail
1.6
Fail
2.6
Fail
2.0
Fail
1.3
Fail
—
2.0
Fail
3.3
AA Large
2.5
Fail
1.6
Fail
2.0
Fail
—
1.7
Fail
1.2
Fail
2.6
Fail
3.3
AA Large
1.7
Fail
—
1.3
Fail
2.0
Fail
2.5
Fail
1.2
Fail
1.3
Fail
—
White BG
4.3AA Large
5.4AA
2.7Fail
1.6Fail
2.2Fail
Black BG
4.9AA
3.9AA Large
7.8AAA
13.0AAA
9.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7C7C1F
7B7917
C3C22F
E3E346
A5A593

Deuteranopia

7B7B27
879716
CBD634
E7EB50
A3A096

Tritanopia

78383D
CC1211
F84044
F9656C
979D9F

Achromatopsia

707070
454545
949494
C1C1C1
A9A9A9

Shades & Tints Shades & Tints

#788100

Dark
Light

#D7021E

Dark
Light

#FF7518

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #788100;
  --color-2: #d7021e;
  --color-3: #ff7518;
  --color-4: #fcc31e;
  --color-5: #95ba86;
}

SCSS

$color-1: #788100;
$color-2: #d7021e;
$color-3: #ff7518;
$color-4: #fcc31e;
$color-5: #95ba86;

TAILWIND

colors: {
  'brand-1': '#788100',
  'brand-2': '#d7021e',
  'brand-3': '#ff7518',
  'brand-4': '#fcc31e',
  'brand-5': '#95ba86',
}

RGB Array

[120, 129, 0], [215, 2, 30], [255, 117, 24], [252, 195, 30], [149, 186, 134]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #788100, #D7021E, #FF7518, #FCC31E, #95BA86 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: #788100; --color-2: #d7021e; --color-3: #ff7518; --color-4: #fcc31e; --color-5: #95ba86. 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