#140D1D + #261B22 + #3E2D28 + #8F2533 + #CE1E3B - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#140D1D

Deep Indigo · Black · Dark Purple

HEX

#140D1D

RGB

rgb(20, 13, 29)

HSL

hsl(266, 38%, 8%)

HSB

hsb(266, 55%, 11%)

CMYK

cmyk(31%, 55%, 0%, 89%)

Oklch

oklch(17.7% 0.034 303.3)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

#261B22

Rose Purple · Black · Raspberry

HEX

#261B22

RGB

rgb(38, 27, 34)

HSL

hsl(322, 17%, 13%)

HSB

hsb(322, 29%, 15%)

CMYK

cmyk(0%, 29%, 11%, 85%)

Oklch

oklch(23.9% 0.021 340.4)

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

#3E2D28

Crimson · DarkSlateGray · Deep Berry

HEX

#3E2D28

RGB

rgb(62, 45, 40)

HSL

hsl(14, 22%, 20%)

HSB

hsb(14, 35%, 24%)

CMYK

cmyk(0%, 27%, 35%, 76%)

Oklch

oklch(31.5% 0.027 37.0)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#8F2533

Crimson · Brown · Wine Red

HEX

#8F2533

RGB

rgb(143, 37, 51)

HSL

hsl(352, 59%, 35%)

HSB

hsb(352, 74%, 56%)

CMYK

cmyk(0%, 74%, 64%, 44%)

Oklch

oklch(43.7% 0.141 18.0)

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

#CE1E3B

Vermilion · Crimson · Passion Red

HEX

#CE1E3B

RGB

rgb(206, 30, 59)

HSL

hsl(350, 75%, 46%)

HSB

hsb(350, 85%, 81%)

CMYK

cmyk(0%, 85%, 71%, 19%)

Oklch

oklch(54.9% 0.206 20.1)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

140D1D

151C0D

Analogous

0D0E1C

140D1D

1B0D1C

Triadic

140D1D

1C130D

0D1C13

Split-Comp.

140D1D

1C1B0D

0E1C0D

Tetradic

140D1D

1C0D0E

151C0D

0D1C1B

Contrast Matrix WCAG 2.1 Contrast

140D1D	261B22	3E2D28	8F2533	CE1E3B
—	1.1 Fail	1.5 Fail	2.2 Fail	3.5 AA Large
1.1 Fail	—	1.3 Fail	2.0 Fail	3.1 AA Large
1.5 Fail	1.3 Fail	—	1.5 Fail	2.4 Fail
2.2 Fail	2.0 Fail	1.5 Fail	—	1.6 Fail
3.5 AA Large	3.1 AA Large	2.4 Fail	1.6 Fail	—

White BG

19.0AAA

16.6AAA

13.0AAA

8.5AAA

5.4AA

Black BG

1.1Fail

1.3Fail

1.6Fail

2.5Fail

3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

111119

212120

373629

616030

828034

Deuteranopia

111218

222320

38392A

676F2F

8C9932

Tritanopia

141615

251F1F

3D2A2A

8A2D2C

C52E2D

Achromatopsia

111111

1F1F1F

323232

464646

565656

Shades & Tints Shades & Tints

#140D1D

Dark

Light

#261B22

Dark

Light

#3E2D28

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #140d1d;
  --color-2: #261b22;
  --color-3: #3e2d28;
  --color-4: #8f2533;
  --color-5: #ce1e3b;
}

SCSS

$color-1: #140d1d;
$color-2: #261b22;
$color-3: #3e2d28;
$color-4: #8f2533;
$color-5: #ce1e3b;

TAILWIND

colors: {
  'brand-1': '#140d1d',
  'brand-2': '#261b22',
  'brand-3': '#3e2d28',
  'brand-4': '#8f2533',
  'brand-5': '#ce1e3b',
}

RGB Array

[20, 13, 29], [38, 27, 34], [62, 45, 40], [143, 37, 51], [206, 30, 59]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #140D1D, #261B22, #3E2D28, #8F2533, #CE1E3B 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: #140d1d; --color-2: #261b22; --color-3: #3e2d28; --color-4: #8f2533; --color-5: #ce1e3b. 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