← Back to Editor

#5E0224 · #301021 · #36313B · #5A7375 · #76B3AF

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

#5E0224

Dark Violet · Maroon · Raspberry

HEX
#5E0224
RGB
rgb(94, 2, 36)
HSL
hsl(338, 96%, 19%)
HSB
hsb(338, 98%, 37%)
CMYK
cmyk(0%, 98%, 62%, 63%)
Oklch
oklch(31.0% 0.122 8.3)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#301021

Rose Purple · Black · Raspberry

HEX
#301021
RGB
rgb(48, 16, 33)
HSL
hsl(328, 50%, 13%)
HSB
hsb(328, 67%, 19%)
CMYK
cmyk(0%, 67%, 31%, 81%)
Oklch
oklch(23.1% 0.057 349.5)

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

#36313B

Dark Plum · DarkSlateGray · Dark Stone

HEX
#36313B
RGB
rgb(54, 49, 59)
HSL
hsl(270, 9%, 21%)
HSB
hsb(270, 17%, 23%)
CMYK
cmyk(8%, 17%, 0%, 77%)
Oklch
oklch(32.2% 0.019 307.8)

Traditional「Dark Plum」· Paint「Dark Stone」· Creative Midnight Shadow

#5A7375

Slate Blue · DimGray · Mint Ice

HEX
#5A7375
RGB
rgb(90, 115, 117)
HSL
hsl(184, 13%, 41%)
HSB
hsb(184, 23%, 46%)
CMYK
cmyk(23%, 2%, 0%, 54%)
Oklch
oklch(53.6% 0.029 202.4)

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

#76B3AF

Mineral Blue · MediumAquaMarine · Lake Green

HEX
#76B3AF
RGB
rgb(118, 179, 175)
HSL
hsl(176, 29%, 58%)
HSB
hsb(176, 34%, 70%)
CMYK
cmyk(34%, 0%, 2%, 30%)
Oklch
oklch(72.4% 0.063 190.6)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5E0224
025F3D

Analogous

5F0253
5E0224
5F0E02

Triadic

5E0224
245F02
02245F

Split-Comp.

5E0224
025F0E
02535F

Tetradic

5E0224
535F02
025F3D
0E025F

Contrast Matrix WCAG 2.1 Contrast

5E0224
301021
36313B
5A7375
76B3AF
—
1.2
Fail
1.1
Fail
2.7
Fail
5.9
AA
1.2
Fail
—
1.4
Fail
3.4
AA Large
7.2
AAA
1.1
Fail
1.4
Fail
—
2.5
Fail
5.3
AA
2.7
Fail
3.4
AA Large
2.5
Fail
—
2.1
Fail
5.9
AA
7.2
AAA
5.3
AA
2.1
Fail
—
White BG
13.9AAA
17.2AAA
12.7AAA
5.1AA
2.4Fail
Black BG
1.5Fail
1.2Fail
1.7Fail
4.1AA Large
8.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

36351C
22221D
343439
656575
9091B0

Deuteranopia

3C421A
24261C
343538
636274
8D88B0

Tritanopia

591514
2E1A19
363736
5B7474
79B1B1

Achromatopsia

212121
1C1C1C
343434
6C6C6C
A0A0A0

Shades & Tints Shades & Tints

#5E0224

Dark
Light

#301021

Dark
Light

#36313B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5e0224;
  --color-2: #301021;
  --color-3: #36313b;
  --color-4: #5a7375;
  --color-5: #76b3af;
}

SCSS

$color-1: #5e0224;
$color-2: #301021;
$color-3: #36313b;
$color-4: #5a7375;
$color-5: #76b3af;

TAILWIND

colors: {
  'brand-1': '#5e0224',
  'brand-2': '#301021',
  'brand-3': '#36313b',
  'brand-4': '#5a7375',
  'brand-5': '#76b3af',
}

RGB Array

[94, 2, 36], [48, 16, 33], [54, 49, 59], [90, 115, 117], [118, 179, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5E0224, #301021, #36313B, #5A7375, #76B3AF 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: #5e0224; --color-2: #301021; --color-3: #36313b; --color-4: #5a7375; --color-5: #76b3af. 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