← Back to Editor

#4B0931 · #37335F · #2D618A · #1EA8B6 · #86D7CE

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

#4B0931

Rose Purple · Maroon · Raspberry

HEX
#4B0931
RGB
rgb(75, 9, 49)
HSL
hsl(324, 79%, 16%)
HSB
hsb(324, 88%, 29%)
CMYK
cmyk(0%, 88%, 35%, 71%)
Oklch
oklch(28.1% 0.104 349.1)

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

#37335F

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#37335F
RGB
rgb(55, 51, 95)
HSL
hsl(245, 30%, 29%)
HSB
hsb(245, 46%, 37%)
CMYK
cmyk(42%, 46%, 0%, 63%)
Oklch
oklch(34.8% 0.075 285.9)

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

#2D618A

Lake Blue · DarkSlateBlue · Prussian Blue

HEX
#2D618A
RGB
rgb(45, 97, 138)
HSL
hsl(206, 51%, 36%)
HSB
hsb(206, 67%, 54%)
CMYK
cmyk(67%, 30%, 0%, 46%)
Oklch
oklch(47.6% 0.087 244.9)

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

#1EA8B6

Lake Blue · LightSeaGreen · Mint Ice

HEX
#1EA8B6
RGB
rgb(30, 168, 182)
HSL
hsl(186, 72%, 42%)
HSB
hsb(186, 84%, 71%)
CMYK
cmyk(84%, 8%, 0%, 29%)
Oklch
oklch(67.0% 0.109 205.8)

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

#86D7CE

Jade · SkyBlue · Lake Green

HEX
#86D7CE
RGB
rgb(134, 215, 206)
HSL
hsl(173, 50%, 68%)
HSB
hsb(173, 38%, 84%)
CMYK
cmyk(38%, 0%, 4%, 16%)
Oklch
oklch(82.5% 0.081 186.8)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4B0931
094922

Analogous

430949
4B0931
49090F

Triadic

4B0931
2F4909
092F49

Split-Comp.

4B0931
0F4909
094943

Tetradic

4B0931
494309
094922
090F49

Contrast Matrix WCAG 2.1 Contrast

4B0931
37335F
2D618A
1EA8B6
86D7CE
—
1.3
Fail
2.3
Fail
5.3
AA
9.1
AAA
1.3
Fail
—
1.8
Fail
4.1
AA Large
7.0
AAA
2.3
Fail
1.8
Fail
—
2.3
Fail
4.0
AA Large
5.3
AA
4.1
AA Large
2.3
Fail
—
1.7
Fail
9.1
AAA
7.0
AAA
4.0
AA Large
1.7
Fail
—
White BG
15.2AAA
11.7AAA
6.6AA
2.9Fail
1.7Fail
Black BG
1.4Fail
1.8Fail
3.2AA Large
7.3AAA
12.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2E2E27
353554
444480
5A5BB3
A9AAD0

Deuteranopia

323725
363652
413D7E
5247B2
A49ED1

Tritanopia

48201E
374C4A
307877
25B0AF
8AD2D2

Achromatopsia

212121
393939
565656
808080
BEBEBE

Shades & Tints Shades & Tints

#4B0931

Dark
Light

#37335F

Dark
Light

#2D618A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4b0931;
  --color-2: #37335f;
  --color-3: #2d618a;
  --color-4: #1ea8b6;
  --color-5: #86d7ce;
}

SCSS

$color-1: #4b0931;
$color-2: #37335f;
$color-3: #2d618a;
$color-4: #1ea8b6;
$color-5: #86d7ce;

TAILWIND

colors: {
  'brand-1': '#4b0931',
  'brand-2': '#37335f',
  'brand-3': '#2d618a',
  'brand-4': '#1ea8b6',
  'brand-5': '#86d7ce',
}

RGB Array

[75, 9, 49], [55, 51, 95], [45, 97, 138], [30, 168, 182], [134, 215, 206]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4B0931, #37335F, #2D618A, #1EA8B6, #86D7CE 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: #4b0931; --color-2: #37335f; --color-3: #2d618a; --color-4: #1ea8b6; --color-5: #86d7ce. 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