← Back to Editor

#FDB620 · #D95433 · #C50057 · #FFD084 · #DF6C33

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

#FDB620

Ginger · Orange · Sunflower

HEX
#FDB620
RGB
rgb(253, 182, 32)
HSL
hsl(41, 98%, 56%)
HSB
hsb(41, 87%, 99%)
CMYK
cmyk(0%, 28%, 87%, 1%)
Oklch
oklch(82.2% 0.164 79.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#D95433

Vermilion · Chocolate · Passion Red

HEX
#D95433
RGB
rgb(217, 84, 51)
HSL
hsl(12, 69%, 53%)
HSB
hsb(12, 76%, 85%)
CMYK
cmyk(0%, 61%, 76%, 15%)
Oklch
oklch(61.7% 0.174 35.1)

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

#C50057

Dark Violet · Crimson · Camellia

HEX
#C50057
RGB
rgb(197, 0, 87)
HSL
hsl(334, 100%, 39%)
HSB
hsb(334, 100%, 77%)
CMYK
cmyk(0%, 100%, 56%, 23%)
Oklch
oklch(52.8% 0.212 6.6)

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

#FFD084

Goose Yellow · Khaki · Peach Orange

HEX
#FFD084
RGB
rgb(255, 208, 132)
HSL
hsl(37, 100%, 76%)
HSB
hsb(37, 48%, 100%)
CMYK
cmyk(0%, 18%, 48%, 0%)
Oklch
oklch(88.2% 0.108 78.7)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#DF6C33

Tangerine · Chocolate · Warm Sun

HEX
#DF6C33
RGB
rgb(223, 108, 51)
HSL
hsl(20, 73%, 54%)
HSB
hsb(20, 77%, 87%)
CMYK
cmyk(0%, 52%, 77%, 13%)
Oklch
oklch(65.9% 0.160 44.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FDB620
2166FD

Analogous

FD4921
FDB620
D4FD21

Triadic

FDB620
21FDB7
B721FD

Split-Comp.

FDB620
21D4FD
4921FD

Tetradic

FDB620
21FD49
2166FD
FD21D4

Contrast Matrix WCAG 2.1 Contrast

FDB620
D95433
C50057
FFD084
DF6C33
—
2.3
Fail
3.4
AA Large
1.2
Fail
1.9
Fail
2.3
Fail
—
1.5
Fail
2.8
Fail
1.2
Fail
3.4
AA Large
1.5
Fail
—
4.2
AA Large
1.8
Fail
1.2
Fail
2.8
Fail
4.2
AA Large
—
2.3
Fail
1.9
Fail
1.2
Fail
1.8
Fail
2.3
Fail
—
White BG
1.8Fail
4.0AA Large
6.0AA
1.4Fail
3.3AA Large
Black BG
11.9AAA
5.3AA
3.5AA Large
14.6AAA
6.3AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDE44
9F9E3B
706E42
EBEA96
ADAC41

Deuteranopia

E2E84D
A7B13D
7B8A3D
EDF19B
B4BD44

Tritanopia

F96167
D24143
BB312E
FDA5A8
D94C4E

Achromatopsia

BABABA
787878
454545
D5D5D5
888888

Shades & Tints Shades & Tints

#FDB620

Dark
Light

#D95433

Dark
Light

#C50057

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fdb620;
  --color-2: #d95433;
  --color-3: #c50057;
  --color-4: #ffd084;
  --color-5: #df6c33;
}

SCSS

$color-1: #fdb620;
$color-2: #d95433;
$color-3: #c50057;
$color-4: #ffd084;
$color-5: #df6c33;

TAILWIND

colors: {
  'brand-1': '#fdb620',
  'brand-2': '#d95433',
  'brand-3': '#c50057',
  'brand-4': '#ffd084',
  'brand-5': '#df6c33',
}

RGB Array

[253, 182, 32], [217, 84, 51], [197, 0, 87], [255, 208, 132], [223, 108, 51]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FDB620, #D95433, #C50057, #FFD084, #DF6C33 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: #fdb620; --color-2: #d95433; --color-3: #c50057; --color-4: #ffd084; --color-5: #df6c33. 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