← Back to Editor

#170132 · #361542 · #573E54 · #85AE72 · #BCE1AB

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

#170132

Deep Indigo · Black · Dark Purple

HEX
#170132
RGB
rgb(23, 1, 50)
HSL
hsl(267, 96%, 10%)
HSB
hsb(267, 98%, 20%)
CMYK
cmyk(54%, 98%, 0%, 80%)
Oklch
oklch(17.5% 0.091 297.8)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

#361542

Royal Purple · MidnightBlue · Dark Purple

HEX
#361542
RGB
rgb(54, 21, 66)
HSL
hsl(284, 52%, 17%)
HSB
hsb(284, 68%, 26%)
CMYK
cmyk(18%, 68%, 0%, 74%)
Oklch
oklch(26.9% 0.087 316.0)

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

#573E54

Rose Purple · DarkSlateGray · Eggplant

HEX
#573E54
RGB
rgb(87, 62, 84)
HSL
hsl(307, 17%, 29%)
HSB
hsb(307, 29%, 34%)
CMYK
cmyk(0%, 29%, 3%, 66%)
Oklch
oklch(40.0% 0.049 330.6)

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

#85AE72

Celadon · DarkSeaGreen · Olive Green

HEX
#85AE72
RGB
rgb(133, 174, 114)
HSL
hsl(101, 27%, 56%)
HSB
hsb(101, 34%, 68%)
CMYK
cmyk(24%, 0%, 34%, 32%)
Oklch
oklch(70.6% 0.095 136.1)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#BCE1AB

Celadon · Silver · Apple Green

HEX
#BCE1AB
RGB
rgb(188, 225, 171)
HSL
hsl(101, 47%, 78%)
HSB
hsb(101, 24%, 88%)
CMYK
cmyk(16%, 0%, 24%, 12%)
Oklch
oklch(86.9% 0.082 135.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

170132
1C3201

Analogous

010332
170132
300132

Triadic

170132
321701
013217

Split-Comp.

170132
323001
033201

Tetradic

170132
320103
1C3201
013230

Contrast Matrix WCAG 2.1 Contrast

170132
361542
573E54
85AE72
BCE1AB
—
1.2
Fail
2.0
Fail
7.6
AAA
13.3
AAA
1.2
Fail
—
1.7
Fail
6.2
AA
10.8
AAA
2.0
Fail
1.7
Fail
—
3.7
AA Large
6.5
AA
7.6
AAA
6.2
AA
3.7
AA Large
—
1.7
Fail
13.3
AAA
10.8
AAA
6.5
AA
1.7
Fail
—
White BG
19.3AAA
15.6AAA
9.4AAA
2.5Fail
1.4Fail
Black BG
1.1Fail
1.3Fail
2.2Fail
8.3AAA
14.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0D0D26
282737
4C4C4F
979781
CCCCB8

Deuteranopia

0F1023
2A2C34
4E504D
949184
CAC7BB

Tritanopia

161D1B
342F2D
564A4A
878C8F
BEC2C5

Achromatopsia

0D0D0D
242424
484848
9B9B9B
D0D0D0

Shades & Tints Shades & Tints

#170132

Dark
Light

#361542

Dark
Light

#573E54

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #170132;
  --color-2: #361542;
  --color-3: #573e54;
  --color-4: #85ae72;
  --color-5: #bce1ab;
}

SCSS

$color-1: #170132;
$color-2: #361542;
$color-3: #573e54;
$color-4: #85ae72;
$color-5: #bce1ab;

TAILWIND

colors: {
  'brand-1': '#170132',
  'brand-2': '#361542',
  'brand-3': '#573e54',
  'brand-4': '#85ae72',
  'brand-5': '#bce1ab',
}

RGB Array

[23, 1, 50], [54, 21, 66], [87, 62, 84], [133, 174, 114], [188, 225, 171]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #170132, #361542, #573E54, #85AE72, #BCE1AB is ideal for: tech websites, dark mode UIs, game UIs, 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: #170132; --color-2: #361542; --color-3: #573e54; --color-4: #85ae72; --color-5: #bce1ab. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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