← Back to Editor

#F8E386 · #D84651 · #433036 · #805859 · #95CAB0

nature

A 5-color nature palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlogData Visualization

Color Details Color Details

#F8E386

Goose Yellow · Khaki · Sunflower

HEX
#F8E386
RGB
rgb(248, 227, 134)
HSL
hsl(49, 89%, 75%)
HSB
hsb(49, 46%, 97%)
CMYK
cmyk(0%, 8%, 46%, 3%)
Oklch
oklch(91.3% 0.116 97.0)

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

#D84651

Vermilion · Tomato · Passion Red

HEX
#D84651
RGB
rgb(216, 70, 81)
HSL
hsl(355, 65%, 56%)
HSB
hsb(355, 68%, 85%)
CMYK
cmyk(0%, 68%, 63%, 15%)
Oklch
oklch(60.3% 0.182 20.3)

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

#433036

Dark Violet · DarkSlateGray · Raspberry

HEX
#433036
RGB
rgb(67, 48, 54)
HSL
hsl(341, 17%, 23%)
HSB
hsb(341, 28%, 26%)
CMYK
cmyk(0%, 28%, 19%, 74%)
Oklch
oklch(33.3% 0.029 358.1)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#805859

Crimson · DimGray · Passion Red

HEX
#805859
RGB
rgb(128, 88, 89)
HSL
hsl(358, 19%, 42%)
HSB
hsb(358, 31%, 50%)
CMYK
cmyk(0%, 31%, 30%, 50%)
Oklch
oklch(50.4% 0.053 17.5)

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

#95CAB0

Jade · DarkSeaGreen · Apple Green

HEX
#95CAB0
RGB
rgb(149, 202, 176)
HSL
hsl(151, 33%, 69%)
HSB
hsb(151, 26%, 79%)
CMYK
cmyk(26%, 0%, 13%, 21%)
Oklch
oklch(79.5% 0.067 163.2)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F8E386
879BF8

Analogous

F8AA87
F8E386
D4F887

Triadic

F8E386
87F8E3
E387F8

Split-Comp.

F8E386
87D4F8
AA87F8

Tetradic

F8E386
87F8AA
879BF8
F887D4

Contrast Matrix WCAG 2.1 Contrast

F8E386
D84651
433036
805859
95CAB0
—
3.3
AA Large
9.5
AAA
4.7
AA
1.4
Fail
3.3
AA Large
—
2.9
Fail
1.4
Fail
2.3
Fail
9.5
AAA
2.9
Fail
—
2.0
Fail
6.6
AA
4.7
AA
1.4
Fail
2.0
Fail
—
3.3
AA Large
1.4
Fail
2.3
Fail
6.6
AA
3.3
AA Large
—
White BG
1.3Fail
4.3AA Large
12.2AAA
6.1AA
1.8Fail
Black BG
16.3AAA
4.9AA
1.7Fail
3.5AA Large
11.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EFEF9D
99974E
3B3B35
6F6E59
ACACB6

Deuteranopia

F0F2A2
A1AC4E
3C3D34
717459
A9A5B8

Tritanopia

F7AEB2
D14C4C
423333
7E5959
98BBBC

Achromatopsia

DFDFDF
737373
363636
646464
B7B7B7

Shades & Tints Shades & Tints

#F8E386

Dark
Light

#D84651

Dark
Light

#433036

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f8e386;
  --color-2: #d84651;
  --color-3: #433036;
  --color-4: #805859;
  --color-5: #95cab0;
}

SCSS

$color-1: #f8e386;
$color-2: #d84651;
$color-3: #433036;
$color-4: #805859;
$color-5: #95cab0;

TAILWIND

colors: {
  'brand-1': '#f8e386',
  'brand-2': '#d84651',
  'brand-3': '#433036',
  'brand-4': '#805859',
  'brand-5': '#95cab0',
}

RGB Array

[248, 227, 134], [216, 70, 81], [67, 48, 54], [128, 88, 89], [149, 202, 176]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #F8E386, #D84651, #433036, #805859, #95CAB0 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #f8e386; --color-2: #d84651; --color-3: #433036; --color-4: #805859; --color-5: #95cab0. 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 tech, SaaS, healthcare, eco industries. 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