← Back to Editor

#600011 · #F04861 · #F0A801 · #787832 · #484817

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

#600011

Vermilion · Maroon · Deep Berry

HEX
#600011
RGB
rgb(96, 0, 17)
HSL
hsl(349, 100%, 19%)
HSB
hsb(349, 100%, 38%)
CMYK
cmyk(0%, 100%, 82%, 62%)
Oklch
oklch(30.9% 0.124 21.3)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

#F04861

Peach Pink · Tomato · Coral Red

HEX
#F04861
RGB
rgb(240, 72, 97)
HSL
hsl(351, 85%, 61%)
HSB
hsb(351, 70%, 94%)
CMYK
cmyk(0%, 70%, 60%, 6%)
Oklch
oklch(64.7% 0.203 16.6)

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

#F0A801

Ochre · Orange · Honey Gold

HEX
#F0A801
RGB
rgb(240, 168, 1)
HSL
hsl(42, 99%, 47%)
HSB
hsb(42, 100%, 94%)
CMYK
cmyk(0%, 30%, 100%, 6%)
Oklch
oklch(78.1% 0.163 77.8)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#787832

Autumn Sage · DarkOliveGreen · Honey Gold

HEX
#787832
RGB
rgb(120, 120, 50)
HSL
hsl(60, 41%, 33%)
HSB
hsb(60, 58%, 47%)
CMYK
cmyk(0%, 0%, 58%, 53%)
Oklch
oklch(55.8% 0.092 109.1)

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

#484817

Autumn Sage · DarkOliveGreen · Amber Gold

HEX
#484817
RGB
rgb(72, 72, 23)
HSL
hsl(60, 52%, 19%)
HSB
hsb(60, 68%, 28%)
CMYK
cmyk(0%, 0%, 68%, 72%)
Oklch
oklch(39.1% 0.069 109.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

600011
00614F

Analogous

610042
600011
611F00

Triadic

600011
126100
001261

Split-Comp.

600011
00611F
004261

Tetradic

600011
426100
00614F
1F0061

Contrast Matrix WCAG 2.1 Contrast

600011
F04861
F0A801
787832
484817
—
3.9
AA Large
6.8
AA
3.0
AA Large
1.5
Fail
3.9
AA Large
—
1.8
Fail
1.3
Fail
2.6
Fail
6.8
AA
1.8
Fail
—
2.3
Fail
4.7
AA
3.0
AA Large
1.3
Fail
2.3
Fail
—
2.0
Fail
1.5
Fail
2.6
Fail
4.7
AA
2.0
Fail
—
White BG
13.9AAA
3.6AA Large
2.0Fail
4.6AA
9.5AAA
Black BG
1.5Fail
5.8AA
10.3AAA
4.5AA
2.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

36360D
A7A65B
D1D029
787843
484823

Deuteranopia

3C430C
B1BE59
D5DA33
787847
484826

Tritanopia

5B0A09
E85655
EC4950
785053
482C2E

Achromatopsia

1F1F1F
7D7D7D
AAAAAA
707070
424242

Shades & Tints Shades & Tints

#600011

Dark
Light

#F04861

Dark
Light

#F0A801

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #600011;
  --color-2: #f04861;
  --color-3: #f0a801;
  --color-4: #787832;
  --color-5: #484817;
}

SCSS

$color-1: #600011;
$color-2: #f04861;
$color-3: #f0a801;
$color-4: #787832;
$color-5: #484817;

TAILWIND

colors: {
  'brand-1': '#600011',
  'brand-2': '#f04861',
  'brand-3': '#f0a801',
  'brand-4': '#787832',
  'brand-5': '#484817',
}

RGB Array

[96, 0, 17], [240, 72, 97], [240, 168, 1], [120, 120, 50], [72, 72, 23]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #600011, #F04861, #F0A801, #787832, #484817 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, 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: #600011; --color-2: #f04861; --color-3: #f0a801; --color-4: #787832; --color-5: #484817. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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