← Back to Editor

#F7E0A1 · #FCBD16 · #D5A4EB · #9C2C81 · #660C51

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

#F7E0A1

Goose Yellow · Wheat · Lemon Cream

HEX
#F7E0A1
RGB
rgb(247, 224, 161)
HSL
hsl(44, 84%, 80%)
HSB
hsb(44, 35%, 97%)
CMYK
cmyk(0%, 9%, 35%, 3%)
Oklch
oklch(91.1% 0.084 90.3)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#FCBD16

Ginger · Orange · Sunflower

HEX
#FCBD16
RGB
rgb(252, 189, 22)
HSL
hsl(44, 97%, 54%)
HSB
hsb(44, 91%, 99%)
CMYK
cmyk(0%, 25%, 91%, 1%)
Oklch
oklch(83.4% 0.168 83.7)

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

#D5A4EB

Lilac · Violet · Lilac Purple

HEX
#D5A4EB
RGB
rgb(213, 164, 235)
HSL
hsl(281, 64%, 78%)
HSB
hsb(281, 30%, 92%)
CMYK
cmyk(9%, 30%, 0%, 8%)
Oklch
oklch(78.8% 0.111 315.1)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#9C2C81

Rose Purple · DarkMagenta · Eggplant

HEX
#9C2C81
RGB
rgb(156, 44, 129)
HSL
hsl(314, 56%, 39%)
HSB
hsb(314, 72%, 61%)
CMYK
cmyk(0%, 72%, 17%, 39%)
Oklch
oklch(49.4% 0.173 339.2)

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

#660C51

Rose Purple · Purple · Eggplant

HEX
#660C51
RGB
rgb(102, 12, 81)
HSL
hsl(314, 79%, 22%)
HSB
hsb(314, 88%, 40%)
CMYK
cmyk(0%, 88%, 21%, 60%)
Oklch
oklch(35.1% 0.141 340.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F7E0A1
A1B8F7

Analogous

F7B5A1
F7E0A1
E3F7A1

Triadic

F7E0A1
A1F7E0
E0A1F7

Split-Comp.

F7E0A1
A1E3F7
B5A1F7

Tetradic

F7E0A1
A1F7B5
A1B8F7
F7A1E3

Contrast Matrix WCAG 2.1 Contrast

F7E0A1
FCBD16
D5A4EB
9C2C81
660C51
—
1.3
Fail
1.6
Fail
5.2
AA
9.3
AAA
1.3
Fail
—
1.2
Fail
4.0
AA Large
7.2
AAA
1.6
Fail
1.2
Fail
—
3.3
AA Large
6.0
AA
5.2
AA
4.0
AA Large
3.3
AA Large
—
1.8
Fail
9.3
AAA
7.2
AAA
6.0
AA
1.8
Fail
—
White BG
1.3Fail
1.7Fail
2.0Fail
6.8AA
12.1AAA
Black BG
16.1AAA
12.4AAA
10.3AAA
3.1AA Large
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

EDEDB0
E1E03E
C0BFDA
6C6A6C
3F3E40

Deuteranopia

EEF0B4
E4E948
C3C6D6
727A68
444B3C

Tritanopia

F6BCBF
F95E65
D3CCC9
965C59
613330

Achromatopsia

E0E0E0
BDBDBD
BBBBBB
575757
2F2F2F

Shades & Tints Shades & Tints

#F7E0A1

Dark
Light

#FCBD16

Dark
Light

#D5A4EB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f7e0a1;
  --color-2: #fcbd16;
  --color-3: #d5a4eb;
  --color-4: #9c2c81;
  --color-5: #660c51;
}

SCSS

$color-1: #f7e0a1;
$color-2: #fcbd16;
$color-3: #d5a4eb;
$color-4: #9c2c81;
$color-5: #660c51;

TAILWIND

colors: {
  'brand-1': '#f7e0a1',
  'brand-2': '#fcbd16',
  'brand-3': '#d5a4eb',
  'brand-4': '#9c2c81',
  'brand-5': '#660c51',
}

RGB Array

[247, 224, 161], [252, 189, 22], [213, 164, 235], [156, 44, 129], [102, 12, 81]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F7E0A1, #FCBD16, #D5A4EB, #9C2C81, #660C51 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: #f7e0a1; --color-2: #fcbd16; --color-3: #d5a4eb; --color-4: #9c2c81; --color-5: #660c51. 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