← Back to Editor

#522CAC · #9D3AC9 · #EB557A · #FF8888 · #FFB870

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#522CAC

Deep Indigo · DarkSlateBlue · Navy Blue

HEX
#522CAC
RGB
rgb(82, 44, 172)
HSL
hsl(258, 59%, 42%)
HSB
hsb(258, 74%, 67%)
CMYK
cmyk(52%, 74%, 0%, 33%)
Oklch
oklch(42.5% 0.189 289.3)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#9D3AC9

Royal Purple · DarkOrchid · Violet

HEX
#9D3AC9
RGB
rgb(157, 58, 201)
HSL
hsl(282, 57%, 51%)
HSB
hsb(282, 71%, 79%)
CMYK
cmyk(22%, 71%, 0%, 21%)
Oklch
oklch(55.2% 0.217 313.2)

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

#EB557A

Peach Pink · LightCoral · Coral Red

HEX
#EB557A
RGB
rgb(235, 85, 122)
HSL
hsl(345, 79%, 63%)
HSB
hsb(345, 64%, 92%)
CMYK
cmyk(0%, 64%, 48%, 8%)
Oklch
oklch(65.8% 0.186 8.8)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#FF8888

Peach Pink · LightCoral · Coral Red

HEX
#FF8888
RGB
rgb(255, 136, 136)
HSL
hsl(0, 100%, 77%)
HSB
hsb(0, 47%, 100%)
CMYK
cmyk(0%, 47%, 47%, 0%)
Oklch
oklch(75.8% 0.145 21.0)

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

#FFB870

Goose Yellow · LightSalmon · Warm Sun

HEX
#FFB870
RGB
rgb(255, 184, 112)
HSL
hsl(30, 100%, 72%)
HSB
hsb(30, 56%, 100%)
CMYK
cmyk(0%, 28%, 56%, 0%)
Oklch
oklch(83.4% 0.121 65.2)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

522CAC
84AA2C

Analogous

2C45AA
522CAC
912CAA

Triadic

522CAC
AA522C
2CAA52

Split-Comp.

522CAC
AA912C
45AA2C

Tetradic

522CAC
AA2C45
84AA2C
2CAA91

Contrast Matrix WCAG 2.1 Contrast

522CAC
9D3AC9
EB557A
FF8888
FFB870
—
1.7
Fail
2.6
Fail
3.9
AA Large
5.3
AA
1.7
Fail
—
1.6
Fail
2.4
Fail
3.2
AA Large
2.6
Fail
1.6
Fail
—
1.5
Fail
2.0
Fail
3.9
AA Large
2.4
Fail
1.5
Fail
—
1.4
Fail
5.3
AA
3.2
AA Large
2.0
Fail
1.4
Fail
—
White BG
9.1AAA
5.4AA
3.4AA Large
2.3Fail
1.7Fail
Black BG
2.3Fail
3.9AA Large
6.1AA
9.1AAA
12.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

42418D
7271A6
AAA971
CBCA88
E0E081

Deuteranopia

444786
787F9E
B3BE6F
D2DB88
E4EA86

Tritanopia

50756F
988B85
E46A68
F98888
FB8F92

Achromatopsia

464646
686868
868686
ACACAC
C5C5C5

Shades & Tints Shades & Tints

#522CAC

Dark
Light

#9D3AC9

Dark
Light

#EB557A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #522cac;
  --color-2: #9d3ac9;
  --color-3: #eb557a;
  --color-4: #ff8888;
  --color-5: #ffb870;
}

SCSS

$color-1: #522cac;
$color-2: #9d3ac9;
$color-3: #eb557a;
$color-4: #ff8888;
$color-5: #ffb870;

TAILWIND

colors: {
  'brand-1': '#522cac',
  'brand-2': '#9d3ac9',
  'brand-3': '#eb557a',
  'brand-4': '#ff8888',
  'brand-5': '#ffb870',
}

RGB Array

[82, 44, 172], [157, 58, 201], [235, 85, 122], [255, 136, 136], [255, 184, 112]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #522CAC, #9D3AC9, #EB557A, #FF8888, #FFB870 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: #522cac; --color-2: #9d3ac9; --color-3: #eb557a; --color-4: #ff8888; --color-5: #ffb870. 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