← Back to Editor

#D8EA1C · #FB8D02 · #FC6607 · #FF343D · #3C3A2D

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 App

Color Details Color Details

#D8EA1C

Autumn Sage · GreenYellow · Sunflower

HEX
#D8EA1C
RGB
rgb(216, 234, 28)
HSL
hsl(65, 83%, 51%)
HSB
hsb(65, 88%, 92%)
CMYK
cmyk(8%, 0%, 88%, 8%)
Oklch
oklch(89.3% 0.198 115.3)

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

#FB8D02

Ochre · Orange · Amber Brown

HEX
#FB8D02
RGB
rgb(251, 141, 2)
HSL
hsl(33, 98%, 50%)
HSB
hsb(33, 99%, 98%)
CMYK
cmyk(0%, 44%, 99%, 2%)
Oklch
oklch(74.7% 0.175 59.8)

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

#FC6607

Tangerine · OrangeRed · Warm Sun

HEX
#FC6607
RGB
rgb(252, 102, 7)
HSL
hsl(23, 98%, 51%)
HSB
hsb(23, 97%, 99%)
CMYK
cmyk(0%, 60%, 97%, 1%)
Oklch
oklch(69.1% 0.201 43.5)

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

#FF343D

Vermilion · Crimson · Passion Red

HEX
#FF343D
RGB
rgb(255, 52, 61)
HSL
hsl(357, 100%, 60%)
HSB
hsb(357, 80%, 100%)
CMYK
cmyk(0%, 80%, 76%, 0%)
Oklch
oklch(65.1% 0.235 25.0)

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

#3C3A2D

Autumn Sage · DarkSlateGray · Amber Gold

HEX
#3C3A2D
RGB
rgb(60, 58, 45)
HSL
hsl(52, 14%, 21%)
HSB
hsb(52, 25%, 24%)
CMYK
cmyk(0%, 3%, 25%, 76%)
Oklch
oklch(34.6% 0.022 100.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D8EA1C
2C1AEA

Analogous

EA931A
D8EA1C
71EA1A

Triadic

D8EA1C
1AD8EA
EA1AD8

Split-Comp.

D8EA1C
1A71EA
931AEA

Tetradic

D8EA1C
1AEA93
2C1AEA
EA1A71

Contrast Matrix WCAG 2.1 Contrast

D8EA1C
FB8D02
FC6607
FF343D
3C3A2D
—
1.8
Fail
2.2
Fail
2.7
Fail
8.6
AAA
1.8
Fail
—
1.3
Fail
1.5
Fail
4.9
AA
2.2
Fail
1.3
Fail
—
1.2
Fail
3.8
AA Large
2.7
Fail
1.5
Fail
1.2
Fail
—
3.2
AA Large
8.6
AAA
4.9
AA
3.8
AA Large
3.2
AA Large
—
White BG
1.3Fail
2.4Fail
3.0Fail
3.6AA Large
11.4AAA
Black BG
15.7AAA
8.9AAA
7.0AAA
5.8AA
1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E0E04E
CBCA24
BBBA1E
A7A53B
3B3B30

Deuteranopia

DFDD5A
D2DA2C
C4CF24
B3C23A
3B3B31

Tritanopia

D9757E
F63E44
F43034
F53939
3C3333

Achromatopsia

CDCDCD
9E9E9E
888888
727272
393939

Shades & Tints Shades & Tints

#D8EA1C

Dark
Light

#FB8D02

Dark
Light

#FC6607

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d8ea1c;
  --color-2: #fb8d02;
  --color-3: #fc6607;
  --color-4: #ff343d;
  --color-5: #3c3a2d;
}

SCSS

$color-1: #d8ea1c;
$color-2: #fb8d02;
$color-3: #fc6607;
$color-4: #ff343d;
$color-5: #3c3a2d;

TAILWIND

colors: {
  'brand-1': '#d8ea1c',
  'brand-2': '#fb8d02',
  'brand-3': '#fc6607',
  'brand-4': '#ff343d',
  'brand-5': '#3c3a2d',
}

RGB Array

[216, 234, 28], [251, 141, 2], [252, 102, 7], [255, 52, 61], [60, 58, 45]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D8EA1C, #FB8D02, #FC6607, #FF343D, #3C3A2D is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #d8ea1c; --color-2: #fb8d02; --color-3: #fc6607; --color-4: #ff343d; --color-5: #3c3a2d. 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. 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