#2D161C + #6B2B39 + #53476F + #486381 + #3D9682 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#2D161C

Dark Violet · Black · Raspberry

HEX

#2D161C

RGB

rgb(45, 22, 28)

HSL

hsl(344, 34%, 13%)

HSB

hsb(344, 51%, 18%)

CMYK

cmyk(0%, 51%, 38%, 82%)

Oklch

oklch(23.5% 0.038 3.7)

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

#6B2B39

Crimson · Brown · Wine Red

HEX

#6B2B39

RGB

rgb(107, 43, 57)

HSL

hsl(347, 43%, 29%)

HSB

hsb(347, 60%, 42%)

CMYK

cmyk(0%, 60%, 47%, 58%)

Oklch

oklch(38.4% 0.092 8.9)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#53476F

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX

#53476F

RGB

rgb(83, 71, 111)

HSL

hsl(258, 22%, 36%)

HSB

hsb(258, 36%, 44%)

CMYK

cmyk(25%, 36%, 0%, 56%)

Oklch

oklch(42.7% 0.066 297.3)

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

#486381

Indigo · DarkSlateBlue · Prussian Blue

HEX

#486381

RGB

rgb(72, 99, 129)

HSL

hsl(212, 28%, 39%)

HSB

hsb(212, 44%, 51%)

CMYK

cmyk(44%, 23%, 0%, 49%)

Oklch

oklch(49.1% 0.058 251.6)

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

#3D9682

Mineral Blue · MediumSeaGreen · Mint Ice

HEX

#3D9682

RGB

rgb(61, 150, 130)

HSL

hsl(167, 42%, 41%)

HSB

hsb(167, 59%, 59%)

CMYK

cmyk(59%, 0%, 13%, 41%)

Oklch

oklch(61.4% 0.091 175.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2D161C

162C26

Analogous

2C1627

2D161C

2C1B16

Triadic

2D161C

1C2C16

161C2C

Split-Comp.

2D161C

162C1B

16272C

Tetradic

2D161C

272C16

162C26

1B162C

Contrast Matrix WCAG 2.1 Contrast

2D161C	6B2B39	53476F	486381	3D9682
—	1.6 Fail	2.0 Fail	2.7 Fail	4.7 AA
1.6 Fail	—	1.2 Fail	1.7 Fail	2.9 Fail
2.0 Fail	1.2 Fail	—	1.4 Fail	2.4 Fail
2.7 Fail	1.7 Fail	1.4 Fail	—	1.7 Fail
4.7 AA	2.9 Fail	2.4 Fail	1.7 Fail	—

White BG

16.9AAA

10.3AAA

8.4AAA

6.2AA

3.6AA Large

Black BG

1.2Fail

2.0Fail

2.5Fail

3.4AA Large

5.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

23231B

4F4F36

4E4E65

54547A

646487

Deuteranopia

24261A

535835

4F4F63

525078

5E5888

Tritanopia

2C1919

683332

525E5C

497473

418B8C

Achromatopsia

1E1E1E

404040

4F4F4F

5E5E5E

797979

Shades & Tints Shades & Tints

#2D161C

Dark

Light

#6B2B39

Dark

Light

#53476F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2d161c;
  --color-2: #6b2b39;
  --color-3: #53476f;
  --color-4: #486381;
  --color-5: #3d9682;
}

SCSS

$color-1: #2d161c;
$color-2: #6b2b39;
$color-3: #53476f;
$color-4: #486381;
$color-5: #3d9682;

TAILWIND

colors: {
  'brand-1': '#2d161c',
  'brand-2': '#6b2b39',
  'brand-3': '#53476f',
  'brand-4': '#486381',
  'brand-5': '#3d9682',
}

RGB Array

[45, 22, 28], [107, 43, 57], [83, 71, 111], [72, 99, 129], [61, 150, 130]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2D161C, #6B2B39, #53476F, #486381, #3D9682 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: #2d161c; --color-2: #6b2b39; --color-3: #53476f; --color-4: #486381; --color-5: #3d9682. 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