← Back to Editor

#FCB871 · #B9AE76 · #608E6A · #215F50 · #001818

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#FCB871

Goose Yellow · LightSalmon · Warm Sun

HEX
#FCB871
RGB
rgb(252, 184, 113)
HSL
hsl(31, 96%, 72%)
HSB
hsb(31, 55%, 99%)
CMYK
cmyk(0%, 27%, 55%, 1%)
Oklch
oklch(83.1% 0.118 66.2)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#B9AE76

Autumn Sage · Tan · Sunflower

HEX
#B9AE76
RGB
rgb(185, 174, 118)
HSL
hsl(50, 32%, 59%)
HSB
hsb(50, 36%, 73%)
CMYK
cmyk(0%, 6%, 36%, 27%)
Oklch
oklch(74.7% 0.076 98.4)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#608E6A

Celadon · DimGray · Olive Green

HEX
#608E6A
RGB
rgb(96, 142, 106)
HSL
hsl(133, 19%, 47%)
HSB
hsb(133, 32%, 56%)
CMYK
cmyk(32%, 0%, 25%, 44%)
Oklch
oklch(60.3% 0.074 150.5)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#215F50

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#215F50
RGB
rgb(33, 95, 80)
HSL
hsl(165, 48%, 25%)
HSB
hsb(165, 65%, 37%)
CMYK
cmyk(65%, 0%, 16%, 63%)
Oklch
oklch(44.1% 0.068 174.2)

Traditional「Mineral Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#001818

Lake Blue · Black · Peacock Green

HEX
#001818
RGB
rgb(0, 24, 24)
HSL
hsl(180, 100%, 5%)
HSB
hsb(180, 100%, 9%)
CMYK
cmyk(100%, 0%, 0%, 91%)
Oklch
oklch(18.9% 0.032 194.8)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCB871
73B5FC

Analogous

FC7573
FCB871
FAFC73

Triadic

FCB871
73FCBA
BA73FC

Split-Comp.

FCB871
73FAFC
7573FC

Tetradic

FCB871
73FC75
73B5FC
FC73FA

Contrast Matrix WCAG 2.1 Contrast

FCB871
B9AE76
608E6A
215F50
001818
—
1.3
Fail
2.2
Fail
4.3
AA Large
10.7
AAA
1.3
Fail
—
1.7
Fail
3.3
AA Large
8.2
AAA
2.2
Fail
1.7
Fail
—
2.0
Fail
4.9
AA
4.3
AA Large
3.3
AA Large
2.0
Fail
—
2.5
Fail
10.7
AAA
8.2
AAA
4.9
AA
2.5
Fail
—
White BG
1.7Fail
2.2Fail
3.8AA Large
7.5AAA
18.4AAA
Black BG
12.2AAA
9.4AAA
5.6AA
2.8Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DFDE82
B4B484
747473
3C3C54
0A0B18

Deuteranopia

E3E886
B5B687
716E75
383455
090718

Tritanopia

F99093
B88E91
627A7B
245657
011818

Achromatopsia

C4C4C4
ABABAB
7C7C7C
4B4B4B
111111

Shades & Tints Shades & Tints

#FCB871

Dark
Light

#B9AE76

Dark
Light

#608E6A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcb871;
  --color-2: #b9ae76;
  --color-3: #608e6a;
  --color-4: #215f50;
  --color-5: #001818;
}

SCSS

$color-1: #fcb871;
$color-2: #b9ae76;
$color-3: #608e6a;
$color-4: #215f50;
$color-5: #001818;

TAILWIND

colors: {
  'brand-1': '#fcb871',
  'brand-2': '#b9ae76',
  'brand-3': '#608e6a',
  'brand-4': '#215f50',
  'brand-5': '#001818',
}

RGB Array

[252, 184, 113], [185, 174, 118], [96, 142, 106], [33, 95, 80], [0, 24, 24]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FCB871, #B9AE76, #608E6A, #215F50, #001818 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: #fcb871; --color-2: #b9ae76; --color-3: #608e6a; --color-4: #215f50; --color-5: #001818. 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 general-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