#3D1225 + #3A1B42 + #372C4D + #264952 + #2E5C53 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#3D1225

Dark Violet · Black · Raspberry

HEX

#3D1225

RGB

rgb(61, 18, 37)

HSL

hsl(333, 54%, 15%)

HSB

hsb(333, 70%, 24%)

CMYK

cmyk(0%, 70%, 39%, 76%)

Oklch

oklch(25.9% 0.071 355.8)

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

#3A1B42

Dark Plum · DarkSlateGray · Dark Purple

HEX

#3A1B42

RGB

rgb(58, 27, 66)

HSL

hsl(288, 42%, 18%)

HSB

hsb(288, 59%, 26%)

CMYK

cmyk(12%, 59%, 0%, 74%)

Oklch

oklch(28.4% 0.078 319.1)

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

#372C4D

Deep Indigo · DarkSlateGray · Eggplant

HEX

#372C4D

RGB

rgb(55, 44, 77)

HSL

hsl(260, 27%, 24%)

HSB

hsb(260, 43%, 30%)

CMYK

cmyk(29%, 43%, 0%, 70%)

Oklch

oklch(32.1% 0.059 298.4)

Traditional「Deep Indigo」· Paint「Eggplant」· Creative Blush Sunrise

#264952

Slate Blue · DarkSlateGray · Peacock Green

HEX

#264952

RGB

rgb(38, 73, 82)

HSL

hsl(192, 37%, 24%)

HSB

hsb(192, 54%, 32%)

CMYK

cmyk(54%, 11%, 0%, 68%)

Oklch

oklch(38.3% 0.043 216.3)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#2E5C53

Mineral Blue · DarkSlateGray · Mint Ice

HEX

#2E5C53

RGB

rgb(46, 92, 83)

HSL

hsl(168, 33%, 27%)

HSB

hsb(168, 50%, 36%)

CMYK

cmyk(50%, 0%, 10%, 64%)

Oklch

oklch(43.9% 0.053 179.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3D1225

123B28

Analogous

3B1239

3D1225

3B1412

Triadic

3D1225

243B12

12243B

Split-Comp.

3D1225

123B14

12393B

Tetradic

3D1225

393B12

123B28

14123B

Contrast Matrix WCAG 2.1 Contrast

3D1225	3A1B42	372C4D	264952	2E5C53
—	1.1 Fail	1.2 Fail	1.6 Fail	2.1 Fail
1.1 Fail	—	1.2 Fail	1.5 Fail	2.0 Fail
1.2 Fail	1.2 Fail	—	1.3 Fail	1.7 Fail
1.6 Fail	1.5 Fail	1.3 Fail	—	1.3 Fail
2.1 Fail	2.0 Fail	1.7 Fail	1.3 Fail	—

White BG

16.0AAA

14.8AAA

12.9AAA

9.7AAA

7.6AAA

Black BG

1.3Fail

1.4Fail

1.6Fail

2.2Fail

2.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

2A2A20

2D2C39

323245

353550

424255

Deuteranopia

2D301F

2E3136

333443

33314F

3F3C56

Tritanopia

3B1D1C

38312F

363F3D

284E4E

305757

Achromatopsia

212121

292929

333333

404040

4D4D4D

Shades & Tints Shades & Tints

#3D1225

Dark

Light

#3A1B42

Dark

Light

#372C4D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3d1225;
  --color-2: #3a1b42;
  --color-3: #372c4d;
  --color-4: #264952;
  --color-5: #2e5c53;
}

SCSS

$color-1: #3d1225;
$color-2: #3a1b42;
$color-3: #372c4d;
$color-4: #264952;
$color-5: #2e5c53;

TAILWIND

colors: {
  'brand-1': '#3d1225',
  'brand-2': '#3a1b42',
  'brand-3': '#372c4d',
  'brand-4': '#264952',
  'brand-5': '#2e5c53',
}

RGB Array

[61, 18, 37], [58, 27, 66], [55, 44, 77], [38, 73, 82], [46, 92, 83]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3D1225, #3A1B42, #372C4D, #264952, #2E5C53 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: #3d1225; --color-2: #3a1b42; --color-3: #372c4d; --color-4: #264952; --color-5: #2e5c53. 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