← Back to Editor

#515056 · #8B5280 · #C553AB · #FF55D5 · #FF7FB1

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#515056

Ink Gray · DarkSlateGray · Charcoal

HEX
#515056
RGB
rgb(81, 80, 86)
HSL
hsl(250, 4%, 33%)
HSB
hsb(250, 7%, 34%)
CMYK
cmyk(6%, 7%, 0%, 66%)
Oklch
oklch(43.4% 0.010 293.6)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#8B5280

Rose Purple · DimGray · Violet

HEX
#8B5280
RGB
rgb(139, 82, 128)
HSL
hsl(312, 26%, 43%)
HSB
hsb(312, 41%, 55%)
CMYK
cmyk(0%, 41%, 8%, 45%)
Oklch
oklch(52.0% 0.099 334.3)

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

#C553AB

Rose Purple · MediumOrchid · Violet

HEX
#C553AB
RGB
rgb(197, 83, 171)
HSL
hsl(314, 50%, 55%)
HSB
hsb(314, 58%, 77%)
CMYK
cmyk(0%, 58%, 13%, 23%)
Oklch
oklch(61.7% 0.177 337.3)

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

#FF55D5

Mauve · Orchid · Lilac Purple

HEX
#FF55D5
RGB
rgb(255, 85, 213)
HSL
hsl(315, 100%, 67%)
HSB
hsb(315, 67%, 100%)
CMYK
cmyk(0%, 67%, 16%, 0%)
Oklch
oklch(72.0% 0.242 339.2)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#FF7FB1

Rouge · LightCoral · Rose Pink

HEX
#FF7FB1
RGB
rgb(255, 127, 177)
HSL
hsl(337, 100%, 75%)
HSB
hsb(337, 50%, 100%)
CMYK
cmyk(0%, 50%, 31%, 0%)
Oklch
oklch(75.6% 0.164 357.1)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

515056
565851

Analogous

515358
515056
555158

Triadic

515056
585251
515852

Split-Comp.

515056
585551
535851

Tetradic

515056
585153
565851
515855

Contrast Matrix WCAG 2.1 Contrast

515056
8B5280
C553AB
FF55D5
FF7FB1
—
1.4
Fail
2.0
Fail
2.9
Fail
3.4
AA Large
1.4
Fail
—
1.4
Fail
2.1
Fail
2.5
Fail
2.0
Fail
1.4
Fail
—
1.4
Fail
1.7
Fail
2.9
Fail
2.1
Fail
1.4
Fail
—
1.2
Fail
3.4
AA Large
2.5
Fail
1.7
Fail
1.2
Fail
—
White BG
8.0AAA
5.8AA
4.0AA Large
2.8Fail
2.4Fail
Black BG
2.6Fail
3.6AA Large
5.2AA
7.5AAA
8.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

515155
727275
949396
B5B4B6
C8C6A5

Deuteranopia

515154
767A72
9AA391
BFCCAF
CFD9A2

Tritanopia

515353
886C6A
BF8581
F79E98
F99B99

Achromatopsia

515151
686868
7F7F7F
969696
ABABAB

Shades & Tints Shades & Tints

#515056

Dark
Light

#8B5280

Dark
Light

#C553AB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #515056;
  --color-2: #8b5280;
  --color-3: #c553ab;
  --color-4: #ff55d5;
  --color-5: #ff7fb1;
}

SCSS

$color-1: #515056;
$color-2: #8b5280;
$color-3: #c553ab;
$color-4: #ff55d5;
$color-5: #ff7fb1;

TAILWIND

colors: {
  'brand-1': '#515056',
  'brand-2': '#8b5280',
  'brand-3': '#c553ab',
  'brand-4': '#ff55d5',
  'brand-5': '#ff7fb1',
}

RGB Array

[81, 80, 86], [139, 82, 128], [197, 83, 171], [255, 85, 213], [255, 127, 177]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #515056, #8B5280, #C553AB, #FF55D5, #FF7FB1 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: #515056; --color-2: #8b5280; --color-3: #c553ab; --color-4: #ff55d5; --color-5: #ff7fb1. 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