← Back to Editor

#FED24D · #CC8008 · #191000 · #C84E29 · #A6B866

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#FED24D

Ginger · SandyBrown · Sunflower

HEX
#FED24D
RGB
rgb(254, 210, 77)
HSL
hsl(45, 99%, 65%)
HSB
hsb(45, 70%, 100%)
CMYK
cmyk(0%, 17%, 70%, 0%)
Oklch
oklch(87.9% 0.153 90.2)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#CC8008

Ochre · DarkGoldenRod · Amber Brown

HEX
#CC8008
RGB
rgb(204, 128, 8)
HSL
hsl(37, 92%, 42%)
HSB
hsb(37, 96%, 80%)
CMYK
cmyk(0%, 37%, 96%, 20%)
Oklch
oklch(66.5% 0.144 68.3)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#191000

Ochre · Black · Cinnamon

HEX
#191000
RGB
rgb(25, 16, 0)
HSL
hsl(38, 100%, 5%)
HSB
hsb(38, 100%, 10%)
CMYK
cmyk(0%, 36%, 100%, 90%)
Oklch
oklch(18.0% 0.037 85.1)

Traditional「Ochre」· Paint「Cinnamon」· Creative Blush Sunrise

#C84E29

Vermilion · Chocolate · Passion Red

HEX
#C84E29
RGB
rgb(200, 78, 41)
HSL
hsl(14, 66%, 47%)
HSB
hsb(14, 80%, 78%)
CMYK
cmyk(0%, 61%, 80%, 22%)
Oklch
oklch(58.1% 0.164 37.0)

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

#A6B866

Grass Green · DarkSeaGreen · Olive Green

HEX
#A6B866
RGB
rgb(166, 184, 102)
HSL
hsl(73, 37%, 56%)
HSB
hsb(73, 45%, 72%)
CMYK
cmyk(10%, 0%, 45%, 28%)
Oklch
oklch(75.0% 0.109 119.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FED24D
4D7AFE

Analogous

FE7A4D
FED24D
D2FE4D

Triadic

FED24D
4DFED2
D24DFE

Split-Comp.

FED24D
4DD2FE
7A4DFE

Tetradic

FED24D
4DFE7A
4D7AFE
FE4DD2

Contrast Matrix WCAG 2.1 Contrast

FED24D
CC8008
191000
C84E29
A6B866
—
2.2
Fail
13.0
AAA
3.2
AA Large
1.5
Fail
2.2
Fail
—
6.0
AA
1.5
Fail
1.5
Fail
13.0
AAA
6.0
AA
—
4.1
AA Large
8.7
AAA
3.2
AA Large
1.5
Fail
4.1
AA Large
—
2.1
Fail
1.5
Fail
1.5
Fail
8.7
AAA
2.1
Fail
—
White BG
1.4Fail
3.2AA Large
18.8AAA
4.6AA
2.2Fail
Black BG
14.5AAA
6.7AA
1.1Fail
4.6AA
9.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EBEB6D
ABAA25
151504
939232
AEAE7A

Deuteranopia

EEF175
B0B52C
161605
9AA334
ADAB7F

Tritanopia

FC878C
C83C41
190708
C2393B
A78A8D

Achromatopsia

D0D0D0
898989
111111
6E6E6E
A9A9A9

Shades & Tints Shades & Tints

#FED24D

Dark
Light

#CC8008

Dark
Light

#191000

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fed24d;
  --color-2: #cc8008;
  --color-3: #191000;
  --color-4: #c84e29;
  --color-5: #a6b866;
}

SCSS

$color-1: #fed24d;
$color-2: #cc8008;
$color-3: #191000;
$color-4: #c84e29;
$color-5: #a6b866;

TAILWIND

colors: {
  'brand-1': '#fed24d',
  'brand-2': '#cc8008',
  'brand-3': '#191000',
  'brand-4': '#c84e29',
  'brand-5': '#a6b866',
}

RGB Array

[254, 210, 77], [204, 128, 8], [25, 16, 0], [200, 78, 41], [166, 184, 102]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FED24D, #CC8008, #191000, #C84E29, #A6B866 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: #fed24d; --color-2: #cc8008; --color-3: #191000; --color-4: #c84e29; --color-5: #a6b866. 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 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