← Back to Editor

#3B0D2C · #5F578A · #55969E · #8BB389 · #BDD9C6

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

#3B0D2C

Rose Purple · Black · Raspberry

HEX
#3B0D2C
RGB
rgb(59, 13, 44)
HSL
hsl(320, 64%, 14%)
HSB
hsb(320, 78%, 23%)
CMYK
cmyk(0%, 78%, 25%, 77%)
Oklch
oklch(25.2% 0.082 343.3)

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

#5F578A

Deep Indigo · DarkSlateBlue · Navy Blue

HEX
#5F578A
RGB
rgb(95, 87, 138)
HSL
hsl(249, 23%, 44%)
HSB
hsb(249, 37%, 54%)
CMYK
cmyk(31%, 37%, 0%, 46%)
Oklch
oklch(48.6% 0.081 290.3)

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

#55969E

Slate Blue · CadetBlue · Mint Ice

HEX
#55969E
RGB
rgb(85, 150, 158)
HSL
hsl(187, 30%, 48%)
HSB
hsb(187, 46%, 62%)
CMYK
cmyk(46%, 5%, 0%, 38%)
Oklch
oklch(63.3% 0.068 205.8)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#8BB389

Celadon · DarkSeaGreen · Apple Green

HEX
#8BB389
RGB
rgb(139, 179, 137)
HSL
hsl(117, 22%, 62%)
HSB
hsb(117, 23%, 70%)
CMYK
cmyk(22%, 0%, 23%, 30%)
Oklch
oklch(72.6% 0.074 143.6)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#BDD9C6

Celadon · Silver · Apple Green

HEX
#BDD9C6
RGB
rgb(189, 217, 198)
HSL
hsl(139, 27%, 80%)
HSB
hsb(139, 13%, 85%)
CMYK
cmyk(13%, 0%, 9%, 15%)
Oklch
oklch(85.9% 0.040 155.8)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3B0D2C
0D3B1C

Analogous

330D3B
3B0D2C
3B0D14

Triadic

3B0D2C
2B3B0D
0D2B3B

Split-Comp.

3B0D2C
143B0D
0D3B33

Tetradic

3B0D2C
3B330D
0D3B1C
0D143B

Contrast Matrix WCAG 2.1 Contrast

3B0D2C
5F578A
55969E
8BB389
BDD9C6
—
2.5
Fail
4.9
AA
7.0
AA
10.9
AAA
2.5
Fail
—
1.9
Fail
2.8
Fail
4.3
AA Large
4.9
AA
1.9
Fail
—
1.4
Fail
2.2
Fail
7.0
AA
2.8
Fail
1.4
Fail
—
1.6
Fail
10.9
AAA
4.3
AA Large
2.2
Fail
1.6
Fail
—
White BG
16.4AAA
6.5AA
3.4AA Large
2.4Fail
1.5Fail
Black BG
1.3Fail
3.2AA Large
6.2AA
8.9AAA
13.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

272724
5C5B7E
71729C
9C9D93
C9C9CB

Deuteranopia

2A2D23
5C5D7B
6D699C
9A9796
C8C5CC

Tritanopia

391F1D
5F7472
589B9A
8D9B9D
BECECF

Achromatopsia

1E1E1E
5F5F5F
838383
A2A2A2
CECECE

Shades & Tints Shades & Tints

#3B0D2C

Dark
Light

#5F578A

Dark
Light

#55969E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3b0d2c;
  --color-2: #5f578a;
  --color-3: #55969e;
  --color-4: #8bb389;
  --color-5: #bdd9c6;
}

SCSS

$color-1: #3b0d2c;
$color-2: #5f578a;
$color-3: #55969e;
$color-4: #8bb389;
$color-5: #bdd9c6;

TAILWIND

colors: {
  'brand-1': '#3b0d2c',
  'brand-2': '#5f578a',
  'brand-3': '#55969e',
  'brand-4': '#8bb389',
  'brand-5': '#bdd9c6',
}

RGB Array

[59, 13, 44], [95, 87, 138], [85, 150, 158], [139, 179, 137], [189, 217, 198]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3B0D2C, #5F578A, #55969E, #8BB389, #BDD9C6 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: #3b0d2c; --color-2: #5f578a; --color-3: #55969e; --color-4: #8bb389; --color-5: #bdd9c6. 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