← Back to Editor

#521447 · #B83060 · #FF8873 · #FFD872 · #F8F6B9

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

#521447

Rose Purple · DarkSlateGray · Dark Purple

HEX
#521447
RGB
rgb(82, 20, 71)
HSL
hsl(311, 61%, 20%)
HSB
hsb(311, 76%, 32%)
CMYK
cmyk(0%, 76%, 13%, 68%)
Oklch
oklch(31.6% 0.111 335.9)

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

#B83060

Dark Violet · MediumVioletRed · Camellia

HEX
#B83060
RGB
rgb(184, 48, 96)
HSL
hsl(339, 59%, 45%)
HSB
hsb(339, 74%, 72%)
CMYK
cmyk(0%, 74%, 48%, 28%)
Oklch
oklch(53.1% 0.175 4.2)

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

#FF8873

Peach Pink · Salmon · Coral Red

HEX
#FF8873
RGB
rgb(255, 136, 115)
HSL
hsl(9, 100%, 73%)
HSB
hsb(9, 55%, 100%)
CMYK
cmyk(0%, 47%, 55%, 0%)
Oklch
oklch(75.4% 0.149 31.3)

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

#FFD872

Goose Yellow · Khaki · Sunflower

HEX
#FFD872
RGB
rgb(255, 216, 114)
HSL
hsl(43, 100%, 72%)
HSB
hsb(43, 55%, 100%)
CMYK
cmyk(0%, 15%, 55%, 0%)
Oklch
oklch(89.5% 0.128 88.8)

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

#F8F6B9

Fresh Green · Bisque · Lemon Cream

HEX
#F8F6B9
RGB
rgb(248, 246, 185)
HSL
hsl(58, 82%, 85%)
HSB
hsb(58, 25%, 97%)
CMYK
cmyk(0%, 1%, 25%, 3%)
Oklch
oklch(96.0% 0.078 106.2)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

521447
14521F

Analogous

3E1452
521447
521428

Triadic

521447
475214
144752

Split-Comp.

521447
285214
14523E

Tetradic

521447
523E14
14521F
142852

Contrast Matrix WCAG 2.1 Contrast

521447
B83060
FF8873
FFD872
F8F6B9
—
2.3
Fail
5.8
AA
9.9
AAA
12.2
AAA
2.3
Fail
—
2.5
Fail
4.2
AA Large
5.2
AA
5.8
AA
2.5
Fail
—
1.7
Fail
2.1
Fail
9.9
AAA
4.2
AA Large
1.7
Fail
—
1.2
Fail
12.2
AAA
5.2
AA
2.1
Fail
1.2
Fail
—
White BG
13.5AAA
5.8AA
2.3Fail
1.4Fail
1.1Fail
Black BG
1.5Fail
3.6AA Large
9.0AAA
15.3AAA
18.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

37373B
7D7C54
CBCA78
EEEE8B
F7F7C8

Deuteranopia

3B3F38
858F52
D2DB79
F0F391
F7F7CB

Tritanopia

4F312F
B14B49
F97C7D
FD9EA2
F8D3D6

Achromatopsia

2C2C2C
5E5E5E
A9A9A9
D8D8D8
F0F0F0

Shades & Tints Shades & Tints

#521447

Dark
Light

#B83060

Dark
Light

#FF8873

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #521447;
  --color-2: #b83060;
  --color-3: #ff8873;
  --color-4: #ffd872;
  --color-5: #f8f6b9;
}

SCSS

$color-1: #521447;
$color-2: #b83060;
$color-3: #ff8873;
$color-4: #ffd872;
$color-5: #f8f6b9;

TAILWIND

colors: {
  'brand-1': '#521447',
  'brand-2': '#b83060',
  'brand-3': '#ff8873',
  'brand-4': '#ffd872',
  'brand-5': '#f8f6b9',
}

RGB Array

[82, 20, 71], [184, 48, 96], [255, 136, 115], [255, 216, 114], [248, 246, 185]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #521447, #B83060, #FF8873, #FFD872, #F8F6B9 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: #521447; --color-2: #b83060; --color-3: #ff8873; --color-4: #ffd872; --color-5: #f8f6b9. 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