← Back to Editor

#FCD801 · #FF6D05 · #FF0101 · #F3EBCC · #6EB30A

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

#FCD801

Autumn Sage · Gold · Honey Gold

HEX
#FCD801
RGB
rgb(252, 216, 1)
HSL
hsl(51, 99%, 50%)
HSB
hsb(51, 100%, 99%)
CMYK
cmyk(0%, 14%, 100%, 1%)
Oklch
oklch(88.6% 0.182 96.8)

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

#FF6D05

Tangerine · OrangeRed · Warm Sun

HEX
#FF6D05
RGB
rgb(255, 109, 5)
HSL
hsl(25, 100%, 51%)
HSB
hsb(25, 98%, 100%)
CMYK
cmyk(0%, 57%, 98%, 0%)
Oklch
oklch(70.5% 0.199 45.5)

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

#FF0101

Vermilion · Red · Passion Red

HEX
#FF0101
RGB
rgb(255, 1, 1)
HSL
hsl(0, 100%, 50%)
HSB
hsb(0, 100%, 100%)
CMYK
cmyk(0%, 100%, 100%, 0%)
Oklch
oklch(62.8% 0.257 29.2)

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

#F3EBCC

Goose Yellow · Bisque · Lemon Cream

HEX
#F3EBCC
RGB
rgb(243, 235, 204)
HSL
hsl(48, 62%, 88%)
HSB
hsb(48, 16%, 95%)
CMYK
cmyk(0%, 3%, 16%, 5%)
Oklch
oklch(93.8% 0.042 95.1)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#6EB30A

Grass Green · Olive · Forest Green

HEX
#6EB30A
RGB
rgb(110, 179, 10)
HSL
hsl(84, 89%, 37%)
HSB
hsb(84, 94%, 70%)
CMYK
cmyk(39%, 0%, 94%, 30%)
Oklch
oklch(69.4% 0.190 131.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCD801
0127FE

Analogous

FE5A01
FCD801
A5FE01

Triadic

FCD801
01FED8
D801FE

Split-Comp.

FCD801
01A5FE
5A01FE

Tetradic

FCD801
01FE5A
0127FE
FE01A5

Contrast Matrix WCAG 2.1 Contrast

FCD801
FF6D05
FF0101
F3EBCC
6EB30A
—
2.0
Fail
2.8
Fail
1.2
Fail
1.8
Fail
2.0
Fail
—
1.4
Fail
2.4
Fail
1.1
Fail
2.8
Fail
1.4
Fail
—
3.3
AA Large
1.5
Fail
1.2
Fail
2.4
Fail
3.3
AA Large
—
2.2
Fail
1.8
Fail
1.1
Fail
1.5
Fail
2.2
Fail
—
White BG
1.4Fail
2.8Fail
4.0AA Large
1.2Fail
2.6Fail
Black BG
15.0AAA
7.4AAA
5.3AA
17.6AAA
8.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ECEC35
C0BE1E
918F01
F0EFD4
8C8C33

Deuteranopia

EFF142
C8D324
A0B301
F0F1D5
88833D

Tritanopia

FA5E67
F83236
F20101
F3D9DB
71535A

Achromatopsia

CACACA
8D8D8D
4D4D4D
EAEAEA
8B8B8B

Shades & Tints Shades & Tints

#FCD801

Dark
Light

#FF6D05

Dark
Light

#FF0101

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcd801;
  --color-2: #ff6d05;
  --color-3: #ff0101;
  --color-4: #f3ebcc;
  --color-5: #6eb30a;
}

SCSS

$color-1: #fcd801;
$color-2: #ff6d05;
$color-3: #ff0101;
$color-4: #f3ebcc;
$color-5: #6eb30a;

TAILWIND

colors: {
  'brand-1': '#fcd801',
  'brand-2': '#ff6d05',
  'brand-3': '#ff0101',
  'brand-4': '#f3ebcc',
  'brand-5': '#6eb30a',
}

RGB Array

[252, 216, 1], [255, 109, 5], [255, 1, 1], [243, 235, 204], [110, 179, 10]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #FCD801, #FF6D05, #FF0101, #F3EBCC, #6EB30A 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: #fcd801; --color-2: #ff6d05; --color-3: #ff0101; --color-4: #f3ebcc; --color-5: #6eb30a. 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