#012345 + #123456 + #234567 + #345678 + #456789 · dark - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#012345

Indigo · MidnightBlue · Deep Sea Blue

HEX

#012345

RGB

rgb(1, 35, 69)

HSL

hsl(210, 97%, 14%)

HSB

hsb(210, 99%, 27%)

CMYK

cmyk(99%, 49%, 0%, 73%)

Oklch

oklch(25.5% 0.075 252.1)

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

#123456

Indigo · MidnightBlue · Deep Sea Blue

HEX

#123456

RGB

rgb(18, 52, 86)

HSL

hsl(210, 65%, 20%)

HSB

hsb(210, 79%, 34%)

CMYK

cmyk(79%, 40%, 0%, 66%)

Oklch

oklch(31.9% 0.072 251.2)

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

#234567

Indigo · DarkSlateGray · Prussian Blue

HEX

#234567

RGB

rgb(35, 69, 103)

HSL

hsl(210, 49%, 27%)

HSB

hsb(210, 66%, 40%)

CMYK

cmyk(66%, 33%, 0%, 60%)

Oklch

oklch(38.2% 0.071 250.2)

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

#345678

Indigo · DarkSlateBlue · Prussian Blue

HEX

#345678

RGB

rgb(52, 86, 120)

HSL

hsl(210, 40%, 34%)

HSB

hsb(210, 57%, 47%)

CMYK

cmyk(57%, 28%, 0%, 53%)

Oklch

oklch(44.3% 0.069 249.6)

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

#456789

Indigo · DarkSlateBlue · Prussian Blue

HEX

#456789

RGB

rgb(69, 103, 137)

HSL

hsl(210, 33%, 40%)

HSB

hsb(210, 50%, 54%)

CMYK

cmyk(50%, 25%, 0%, 46%)

Oklch

oklch(50.2% 0.067 249.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

012345

462401

Analogous

014646

012345

010146

Triadic

012345

460124

244601

Split-Comp.

012345

460101

464601

Tetradic

012345

460146

462401

014601

Contrast Matrix WCAG 2.1 Contrast

012345	123456	234567	345678	456789
—	1.2 Fail	1.6 Fail	2.1 Fail	2.7 Fail
1.2 Fail	—	1.3 Fail	1.7 Fail	2.2 Fail
1.6 Fail	1.3 Fail	—	1.3 Fail	1.7 Fail
2.1 Fail	1.7 Fail	1.3 Fail	—	1.3 Fail
2.7 Fail	2.2 Fail	1.7 Fail	1.3 Fail	—

White BG

15.8AAA

12.7AAA

9.9AAA

7.6AAA

5.9AA

Black BG

1.3Fail

1.7Fail

2.1Fail

2.7Fail

3.6AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

10103D

21214E

32325F

434370

545481

Deuteranopia

0E0B3B

1F1C4C

302D5D

413E6E

524F7F

Tritanopia

033635

144746

255857

366968

477A79

Achromatopsia

1D1D1D

2E2E2E

3F3F3F

505050

616161

Shades & Tints Shades & Tints

#012345

Dark

Light

#123456

Dark

Light

#234567

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #012345;
  --color-2: #123456;
  --color-3: #234567;
  --color-4: #345678;
  --color-5: #456789;
}

SCSS

$color-1: #012345;
$color-2: #123456;
$color-3: #234567;
$color-4: #345678;
$color-5: #456789;

TAILWIND

colors: {
  'brand-1': '#012345',
  'brand-2': '#123456',
  'brand-3': '#234567',
  'brand-4': '#345678',
  'brand-5': '#456789',
}

RGB Array

[1, 35, 69], [18, 52, 86], [35, 69, 103], [52, 86, 120], [69, 103, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #012345, #123456, #234567, #345678, #456789 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: #012345; --color-2: #123456; --color-3: #234567; --color-4: #345678; --color-5: #456789. 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