← Back to Editor

#153959 · #856CB0 · #DC82B5 · #CD5B8E · #3165AE

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

#153959

Lake Blue · DarkSlateGray · Prussian Blue

HEX
#153959
RGB
rgb(21, 57, 89)
HSL
hsl(208, 62%, 22%)
HSB
hsb(208, 76%, 35%)
CMYK
cmyk(76%, 36%, 0%, 65%)
Oklch
oklch(33.6% 0.070 248.4)

Traditional「Lake Blue」· Paint「Prussian Blue」· Creative Blush Sunrise

#856CB0

Deep Indigo · LightSlateGray · Violet

HEX
#856CB0
RGB
rgb(133, 108, 176)
HSL
hsl(262, 30%, 56%)
HSB
hsb(262, 39%, 69%)
CMYK
cmyk(24%, 39%, 0%, 31%)
Oklch
oklch(58.3% 0.105 300.1)

Traditional「Deep Indigo」· Paint「Violet」· Creative Blush Sunrise

#DC82B5

Mauve · Orchid · Rose Pink

HEX
#DC82B5
RGB
rgb(220, 130, 181)
HSL
hsl(326, 56%, 69%)
HSB
hsb(326, 41%, 86%)
CMYK
cmyk(0%, 41%, 18%, 14%)
Oklch
oklch(71.8% 0.127 345.7)

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

#CD5B8E

Dark Violet · LightCoral · Rose Pink

HEX
#CD5B8E
RGB
rgb(205, 91, 142)
HSL
hsl(333, 53%, 58%)
HSB
hsb(333, 56%, 80%)
CMYK
cmyk(0%, 56%, 31%, 20%)
Oklch
oklch(62.8% 0.154 354.5)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#3165AE

Indigo · SteelBlue · Navy Blue

HEX
#3165AE
RGB
rgb(49, 101, 174)
HSL
hsl(215, 56%, 44%)
HSB
hsb(215, 72%, 68%)
CMYK
cmyk(72%, 42%, 0%, 32%)
Oklch
oklch(50.9% 0.129 257.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

153959
5B3615

Analogous

155B59
153959
15185B

Triadic

153959
5B153A
3A5B15

Split-Comp.

153959
5B1518
5B5915

Tetradic

153959
59155B
5B3615
185B15

Contrast Matrix WCAG 2.1 Contrast

153959
856CB0
DC82B5
CD5B8E
3165AE
—
2.7
Fail
4.5
AA Large
3.1
AA Large
2.0
Fail
2.7
Fail
—
1.7
Fail
1.1
Fail
1.3
Fail
4.5
AA Large
1.7
Fail
—
1.4
Fail
2.2
Fail
3.1
AA Large
1.1
Fail
1.4
Fail
—
1.5
Fail
2.0
Fail
1.3
Fail
2.2
Fail
1.5
Fail
—
White BG
11.9AAA
4.4AA Large
2.7Fail
3.8AA Large
5.8AA
Black BG
1.8Fail
4.8AA
7.9AAA
5.5AA
3.6AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

252551
7A7AA0
B5B4A9
9C9B82
48489C

Deuteranopia

23204F
7C7E9C
BAC1A6
A2AB7F
454198

Tritanopia

174B4A
849390
D89F9D
C77876
348E8B

Achromatopsia

323232
7B7B7B
A3A3A3
838383
5E5E5E

Shades & Tints Shades & Tints

#153959

Dark
Light

#856CB0

Dark
Light

#DC82B5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #153959;
  --color-2: #856cb0;
  --color-3: #dc82b5;
  --color-4: #cd5b8e;
  --color-5: #3165ae;
}

SCSS

$color-1: #153959;
$color-2: #856cb0;
$color-3: #dc82b5;
$color-4: #cd5b8e;
$color-5: #3165ae;

TAILWIND

colors: {
  'brand-1': '#153959',
  'brand-2': '#856cb0',
  'brand-3': '#dc82b5',
  'brand-4': '#cd5b8e',
  'brand-5': '#3165ae',
}

RGB Array

[21, 57, 89], [133, 108, 176], [220, 130, 181], [205, 91, 142], [49, 101, 174]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #153959, #856CB0, #DC82B5, #CD5B8E, #3165AE 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: #153959; --color-2: #856cb0; --color-3: #dc82b5; --color-4: #cd5b8e; --color-5: #3165ae. 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