#040114 + #070814 + #0F151A + #121E1F + #2B1F1F · dark - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#040114

Deep Indigo · Black · Deep Sea Blue

HEX

#040114

RGB

rgb(4, 1, 20)

HSL

hsl(249, 90%, 4%)

HSB

hsb(249, 95%, 8%)

CMYK

cmyk(80%, 95%, 0%, 92%)

Oklch

oklch(10.5% 0.051 287.3)

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

#070814

Indigo · Black · Deep Sea Blue

HEX

#070814

RGB

rgb(7, 8, 20)

HSL

hsl(235, 48%, 5%)

HSB

hsb(235, 65%, 8%)

CMYK

cmyk(65%, 60%, 0%, 92%)

Oklch

oklch(14.1% 0.027 278.2)

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

#0F151A

Slate Blue · Black · Deep Sea Blue

HEX

#0F151A

RGB

rgb(15, 21, 26)

HSL

hsl(207, 27%, 8%)

HSB

hsb(207, 42%, 10%)

CMYK

cmyk(42%, 19%, 0%, 90%)

Oklch

oklch(19.2% 0.014 243.7)

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

#121E1F

Slate Blue · Black · Peacock Green

HEX

#121E1F

RGB

rgb(18, 30, 31)

HSL

hsl(185, 27%, 10%)

HSB

hsb(185, 42%, 12%)

CMYK

cmyk(42%, 3%, 0%, 88%)

Oklch

oklch(22.4% 0.017 202.5)

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

#2B1F1F

Crimson · Black · Deep Berry

HEX

#2B1F1F

RGB

rgb(43, 31, 31)

HSL

hsl(0, 16%, 15%)

HSB

hsb(0, 28%, 17%)

CMYK

cmyk(0%, 28%, 28%, 83%)

Oklch

oklch(25.4% 0.019 18.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

040114

111301

Analogous

010713

040114

0D0113

Triadic

040114

130401

011304

Split-Comp.

040114

130D01

071301

Tetradic

040114

130107

111301

01130D

Contrast Matrix WCAG 2.1 Contrast

040114	070814	0F151A	121E1F	2B1F1F
—	1.0 Fail	1.1 Fail	1.2 Fail	1.3 Fail
1.0 Fail	—	1.1 Fail	1.2 Fail	1.3 Fail
1.1 Fail	1.1 Fail	—	1.1 Fail	1.2 Fail
1.2 Fail	1.2 Fail	1.1 Fail	—	1.1 Fail
1.3 Fail	1.3 Fail	1.2 Fail	1.1 Fail	—

White BG

20.6AAA

19.9AAA

18.4AAA

17.1AAA

15.9AAA

Black BG

1.0Fail

1.1Fail

1.2Fail

1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

03030F

070711

121219

17171F

26261F

Deuteranopia

03030E

070710

111119

17161F

27271F

Tritanopia

040C0B

070F0E

0F1818

131F1F

2A1F1F

Achromatopsia

040404

090909

141414

1B1B1B

232323

Shades & Tints Shades & Tints

#040114

Dark

Light

#070814

Dark

Light

#0F151A

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #040114;
  --color-2: #070814;
  --color-3: #0f151a;
  --color-4: #121e1f;
  --color-5: #2b1f1f;
}

SCSS

$color-1: #040114;
$color-2: #070814;
$color-3: #0f151a;
$color-4: #121e1f;
$color-5: #2b1f1f;

TAILWIND

colors: {
  'brand-1': '#040114',
  'brand-2': '#070814',
  'brand-3': '#0f151a',
  'brand-4': '#121e1f',
  'brand-5': '#2b1f1f',
}

RGB Array

[4, 1, 20], [7, 8, 20], [15, 21, 26], [18, 30, 31], [43, 31, 31]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #040114, #070814, #0F151A, #121E1F, #2B1F1F 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: #040114; --color-2: #070814; --color-3: #0f151a; --color-4: #121e1f; --color-5: #2b1f1f. 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 dark-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