← Back to Editor

#F6D865 · #FB6B45 · #F10C47 · #A70264 · #5A207D

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

#F6D865

Ginger · Khaki · Sunflower

HEX
#F6D865
RGB
rgb(246, 216, 101)
HSL
hsl(48, 89%, 68%)
HSB
hsb(48, 59%, 96%)
CMYK
cmyk(0%, 12%, 59%, 4%)
Oklch
oklch(88.5% 0.138 94.8)

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

#FB6B45

Peach Pink · Tomato · Coral Red

HEX
#FB6B45
RGB
rgb(251, 107, 69)
HSL
hsl(13, 96%, 63%)
HSB
hsb(13, 73%, 98%)
CMYK
cmyk(0%, 57%, 73%, 2%)
Oklch
oklch(70.0% 0.185 35.8)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#F10C47

Vermilion · Crimson · Passion Red

HEX
#F10C47
RGB
rgb(241, 12, 71)
HSL
hsl(345, 91%, 50%)
HSB
hsb(345, 95%, 95%)
CMYK
cmyk(0%, 95%, 71%, 5%)
Oklch
oklch(61.0% 0.241 18.4)

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

#A70264

Rose Purple · Purple · Camellia

HEX
#A70264
RGB
rgb(167, 2, 100)
HSL
hsl(324, 98%, 33%)
HSB
hsb(324, 99%, 65%)
CMYK
cmyk(0%, 99%, 40%, 35%)
Oklch
oklch(47.7% 0.195 354.1)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#5A207D

Royal Purple · DarkSlateBlue · Eggplant

HEX
#5A207D
RGB
rgb(90, 32, 125)
HSL
hsl(277, 59%, 31%)
HSB
hsb(277, 74%, 49%)
CMYK
cmyk(28%, 74%, 0%, 51%)
Oklch
oklch(38.0% 0.152 309.4)

Traditional「Royal Purple」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F6D865
6582F6

Analogous

F69065
F6D865
CAF665

Triadic

F6D865
65F6D9
D965F6

Split-Comp.

F6D865
65CAF6
9065F6

Tetradic

F6D865
65F690
6582F6
F665CA

Contrast Matrix WCAG 2.1 Contrast

F6D865
FB6B45
F10C47
A70264
5A207D
—
2.0
Fail
3.1
AA Large
5.3
AA
7.7
AAA
2.0
Fail
—
1.5
Fail
2.6
Fail
3.8
AA Large
3.1
AA Large
1.5
Fail
—
1.7
Fail
2.5
Fail
5.3
AA
2.6
Fail
1.7
Fail
—
1.5
Fail
7.7
AAA
3.8
AA Large
2.5
Fail
1.5
Fail
—
White BG
1.4Fail
2.9Fail
4.3AA Large
7.4AAA
10.8AAA
Black BG
14.9AAA
7.3AAA
4.9AA
2.8Fail
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9E981
BDBB4E
8E8C39
605E4C
414066

Deuteranopia

EBED88
C5D050
9BAC35
697547
444961

Tritanopia

F5979C
F45557
E62D2B
9F3A35
575551

Achromatopsia

D4D4D4
929292
575757
3F3F3F
3C3C3C

Shades & Tints Shades & Tints

#F6D865

Dark
Light

#FB6B45

Dark
Light

#F10C47

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f6d865;
  --color-2: #fb6b45;
  --color-3: #f10c47;
  --color-4: #a70264;
  --color-5: #5a207d;
}

SCSS

$color-1: #f6d865;
$color-2: #fb6b45;
$color-3: #f10c47;
$color-4: #a70264;
$color-5: #5a207d;

TAILWIND

colors: {
  'brand-1': '#f6d865',
  'brand-2': '#fb6b45',
  'brand-3': '#f10c47',
  'brand-4': '#a70264',
  'brand-5': '#5a207d',
}

RGB Array

[246, 216, 101], [251, 107, 69], [241, 12, 71], [167, 2, 100], [90, 32, 125]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F6D865, #FB6B45, #F10C47, #A70264, #5A207D 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: #f6d865; --color-2: #fb6b45; --color-3: #f10c47; --color-4: #a70264; --color-5: #5a207d. 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