#182132 + #2C1E35 + #A9036F + #3F3E50 + #606E77 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#182132

Indigo · DarkSlateGray · Deep Sea Blue

HEX

#182132

RGB

rgb(24, 33, 50)

HSL

hsl(219, 35%, 15%)

HSB

hsb(219, 52%, 20%)

CMYK

cmyk(52%, 34%, 0%, 80%)

Oklch

oklch(24.8% 0.035 262.6)

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

#2C1E35

Dark Plum · DarkSlateGray · Dark Purple

HEX

#2C1E35

RGB

rgb(44, 30, 53)

HSL

hsl(277, 28%, 16%)

HSB

hsb(277, 43%, 21%)

CMYK

cmyk(17%, 43%, 0%, 79%)

Oklch

oklch(26.3% 0.046 311.4)

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

#A9036F

Rose Purple · DarkMagenta · Camellia

HEX

#A9036F

RGB

rgb(169, 3, 111)

HSL

hsl(321, 97%, 34%)

HSB

hsb(321, 98%, 66%)

CMYK

cmyk(0%, 98%, 34%, 34%)

Oklch

oklch(48.6% 0.201 349.9)

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

#3F3E50

Deep Indigo · DarkSlateGray · Prussian Blue

HEX

#3F3E50

RGB

rgb(63, 62, 80)

HSL

hsl(243, 13%, 28%)

HSB

hsb(243, 23%, 31%)

CMYK

cmyk(21%, 22%, 0%, 69%)

Oklch

oklch(37.2% 0.031 287.4)

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

#606E77

Slate Blue · DimGray · Navy Blue

HEX

#606E77

RGB

rgb(96, 110, 119)

HSL

hsl(203, 11%, 42%)

HSB

hsb(203, 19%, 47%)

CMYK

cmyk(19%, 8%, 0%, 53%)

Oklch

oklch(53.0% 0.022 236.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

182132

342A19

Analogous

193034

182132

1D1934

Triadic

182132

341922

223419

Split-Comp.

182132

341D19

303419

Tetradic

182132

341930

342A19

19341D

Contrast Matrix WCAG 2.1 Contrast

182132	2C1E35	A9036F	3F3E50	606E77
—	1.0 Fail	2.2 Fail	1.5 Fail	3.1 AA Large
1.0 Fail	—	2.2 Fail	1.5 Fail	3.0 Fail
2.2 Fail	2.2 Fail	—	1.5 Fail	1.4 Fail
1.5 Fail	1.5 Fail	1.5 Fail	—	2.0 Fail
3.1 AA Large	3.0 Fail	1.4 Fail	2.0 Fail	—

White BG

16.1AAA

15.6AAA

7.2AAA

10.4AAA

5.3AA

Black BG

1.3Fail

2.9Fail

2.0Fail

4.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

1C1C2E

26262F

616055

3F3F4C

666675

Deuteranopia

1B1B2D

27282E

6B774F

3F3F4B

656474

Tritanopia

182B2A

2B2B2A

A1403C

3F4847

617373

Achromatopsia

202020

252525

414141

404040

6B6B6B

Shades & Tints Shades & Tints

#182132

Dark

Light

#2C1E35

Dark

Light

#A9036F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #182132;
  --color-2: #2c1e35;
  --color-3: #a9036f;
  --color-4: #3f3e50;
  --color-5: #606e77;
}

SCSS

$color-1: #182132;
$color-2: #2c1e35;
$color-3: #a9036f;
$color-4: #3f3e50;
$color-5: #606e77;

TAILWIND

colors: {
  'brand-1': '#182132',
  'brand-2': '#2c1e35',
  'brand-3': '#a9036f',
  'brand-4': '#3f3e50',
  'brand-5': '#606e77',
}

RGB Array

[24, 33, 50], [44, 30, 53], [169, 3, 111], [63, 62, 80], [96, 110, 119]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #182132, #2C1E35, #A9036F, #3F3E50, #606E77 is ideal for: tech websites, dark mode UIs, game UIs. 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: #182132; --color-2: #2c1e35; --color-3: #a9036f; --color-4: #3f3e50; --color-5: #606e77. 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. 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