#142A35 + #11252D + #290815 + #3B0D1F + #601033 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#142A35

Slate Blue · DarkSlateGray · Deep Sea Blue

HEX

#142A35

RGB

rgb(20, 42, 53)

HSL

hsl(200, 45%, 14%)

HSB

hsb(200, 62%, 21%)

CMYK

cmyk(62%, 21%, 0%, 79%)

Oklch

oklch(27.2% 0.035 231.7)

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

#11252D

Slate Blue · Black · Peacock Green

HEX

#11252D

RGB

rgb(17, 37, 45)

HSL

hsl(197, 45%, 12%)

HSB

hsb(197, 62%, 18%)

CMYK

cmyk(62%, 18%, 0%, 82%)

Oklch

oklch(25.2% 0.030 225.9)

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

#290815

Dark Violet · Black · Raspberry

HEX

#290815

RGB

rgb(41, 8, 21)

HSL

hsl(336, 67%, 10%)

HSB

hsb(336, 80%, 16%)

CMYK

cmyk(0%, 80%, 49%, 84%)

Oklch

oklch(19.9% 0.057 359.2)

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

#3B0D1F

Dark Violet · Black · Raspberry

HEX

#3B0D1F

RGB

rgb(59, 13, 31)

HSL

hsl(337, 64%, 14%)

HSB

hsb(337, 78%, 23%)

CMYK

cmyk(0%, 78%, 47%, 77%)

Oklch

oklch(24.6% 0.074 0.2)

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

#601033

Dark Violet · Maroon · Raspberry

HEX

#601033

RGB

rgb(96, 16, 51)

HSL

hsl(334, 71%, 22%)

HSB

hsb(334, 83%, 38%)

CMYK

cmyk(0%, 83%, 47%, 62%)

Oklch

oklch(32.9% 0.116 359.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

142A35

341E14

Analogous

14342E

142A35

141934

Triadic

142A35

341429

293414

Split-Comp.

142A35

341419

342E14

Tetradic

142A35

2E1434

341E14

193414

Contrast Matrix WCAG 2.1 Contrast

142A35	11252D	290815	3B0D1F	601033
—	1.1 Fail	1.2 Fail	1.1 Fail	1.1 Fail
1.1 Fail	—	1.2 Fail	1.0 Fail	1.2 Fail
1.2 Fail	1.2 Fail	—	1.1 Fail	1.4 Fail
1.1 Fail	1.0 Fail	1.1 Fail	—	1.3 Fail
1.1 Fail	1.2 Fail	1.4 Fail	1.3 Fail	—

White BG

14.9AAA

15.8AAA

18.4AAA

16.6AAA

13.0AAA

Black BG

1.4Fail

1.3Fail

1.1Fail

1.3Fail

1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

1E1E32

1A1A2B

1B1A12

27271B

3D3D2B

Deuteranopia

1C1B32

19172B

1D1F11

2A2D1A

424828

Tritanopia

153030

122A29

270F0F

391716

5C2422

Achromatopsia

252525

202020

131313

1D1D1D

2C2C2C

Shades & Tints Shades & Tints

#142A35

Dark

Light

#11252D

Dark

Light

#290815

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #142a35;
  --color-2: #11252d;
  --color-3: #290815;
  --color-4: #3b0d1f;
  --color-5: #601033;
}

SCSS

$color-1: #142a35;
$color-2: #11252d;
$color-3: #290815;
$color-4: #3b0d1f;
$color-5: #601033;

TAILWIND

colors: {
  'brand-1': '#142a35',
  'brand-2': '#11252d',
  'brand-3': '#290815',
  'brand-4': '#3b0d1f',
  'brand-5': '#601033',
}

RGB Array

[20, 42, 53], [17, 37, 45], [41, 8, 21], [59, 13, 31], [96, 16, 51]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #142A35, #11252D, #290815, #3B0D1F, #601033 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: #142a35; --color-2: #11252d; --color-3: #290815; --color-4: #3b0d1f; --color-5: #601033. 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