← Back to Editor

#564365 · #A680A0 · #B55185 · #ED7190 · #FB9E87

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#564365

Dark Plum · DarkSlateBlue · Eggplant

HEX
#564365
RGB
rgb(86, 67, 101)
HSL
hsl(274, 20%, 33%)
HSB
hsb(274, 34%, 40%)
CMYK
cmyk(15%, 34%, 0%, 60%)
Oklch
oklch(41.7% 0.060 309.5)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#A680A0

Rose Purple · DarkGray · Violet

HEX
#A680A0
RGB
rgb(166, 128, 160)
HSL
hsl(309, 18%, 58%)
HSB
hsb(309, 23%, 65%)
CMYK
cmyk(0%, 23%, 4%, 35%)
Oklch
oklch(64.7% 0.065 331.8)

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

#B55185

Rose Purple · MediumVioletRed · Rose Pink

HEX
#B55185
RGB
rgb(181, 81, 133)
HSL
hsl(329, 40%, 51%)
HSB
hsb(329, 55%, 71%)
CMYK
cmyk(0%, 55%, 27%, 29%)
Oklch
oklch(57.7% 0.142 350.1)

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

#ED7190

Peach Pink · LightCoral · Coral Red

HEX
#ED7190
RGB
rgb(237, 113, 144)
HSL
hsl(345, 78%, 69%)
HSB
hsb(345, 52%, 93%)
CMYK
cmyk(0%, 52%, 39%, 7%)
Oklch
oklch(70.3% 0.155 6.2)

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

#FB9E87

Peach Pink · LightSalmon · Coral Red

HEX
#FB9E87
RGB
rgb(251, 158, 135)
HSL
hsl(12, 94%, 76%)
HSB
hsb(12, 46%, 98%)
CMYK
cmyk(0%, 37%, 46%, 2%)
Oklch
oklch(78.8% 0.117 34.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

564365
526543

Analogous

464365
564365
654363

Triadic

564365
655643
436556

Split-Comp.

564365
636543
436546

Tetradic

564365
654643
526543
436365

Contrast Matrix WCAG 2.1 Contrast

564365
A680A0
B55185
ED7190
FB9E87
—
2.6
Fail
1.9
Fail
3.1
AA Large
4.3
AA Large
2.6
Fail
—
1.4
Fail
1.2
Fail
1.7
Fail
1.9
Fail
1.4
Fail
—
1.6
Fail
2.3
Fail
3.1
AA Large
1.2
Fail
1.6
Fail
—
1.4
Fail
4.3
AA Large
1.7
Fail
2.3
Fail
1.4
Fail
—
White BG
8.8AAA
3.4AA Large
4.7AA
2.9Fail
2.0Fail
Black BG
2.4Fail
6.2AA
4.5AA Large
7.4AAA
10.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4E4E5D
969598
8A8978
B7B688
D3D28D

Deuteranopia

4F505B
989B96
909775
BFC887
D8DF8E

Tritanopia

555655
A49291
B06E6C
E78381
F69192

Achromatopsia

4D4D4D
8F8F8F
757575
9A9A9A
B7B7B7

Shades & Tints Shades & Tints

#564365

Dark
Light

#A680A0

Dark
Light

#B55185

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #564365;
  --color-2: #a680a0;
  --color-3: #b55185;
  --color-4: #ed7190;
  --color-5: #fb9e87;
}

SCSS

$color-1: #564365;
$color-2: #a680a0;
$color-3: #b55185;
$color-4: #ed7190;
$color-5: #fb9e87;

TAILWIND

colors: {
  'brand-1': '#564365',
  'brand-2': '#a680a0',
  'brand-3': '#b55185',
  'brand-4': '#ed7190',
  'brand-5': '#fb9e87',
}

RGB Array

[86, 67, 101], [166, 128, 160], [181, 81, 133], [237, 113, 144], [251, 158, 135]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #564365, #A680A0, #B55185, #ED7190, #FB9E87 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #564365; --color-2: #a680a0; --color-3: #b55185; --color-4: #ed7190; --color-5: #fb9e87. 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 tech, SaaS, healthcare, eco industries. 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