#1A2F33 + #0D0912 + #10485D + #364F59 + #5A5B5C - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#1A2F33

Slate Blue · DarkSlateGray · Peacock Green

HEX

#1A2F33

RGB

rgb(26, 47, 51)

HSL

hsl(190, 32%, 15%)

HSB

hsb(190, 49%, 20%)

CMYK

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

Oklch

oklch(28.9% 0.028 211.0)

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

#0D0912

Deep Indigo · Black · Dark Purple

HEX

#0D0912

RGB

rgb(13, 9, 18)

HSL

hsl(267, 33%, 5%)

HSB

hsb(267, 50%, 7%)

CMYK

cmyk(28%, 50%, 0%, 93%)

Oklch

oklch(15.0% 0.020 304.5)

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

#10485D

Lake Blue · DarkSlateGray · Peacock Green

HEX

#10485D

RGB

rgb(16, 72, 93)

HSL

hsl(196, 71%, 21%)

HSB

hsb(196, 83%, 36%)

CMYK

cmyk(83%, 23%, 0%, 64%)

Oklch

oklch(37.7% 0.066 228.2)

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

#364F59

Slate Blue · DarkSlateGray · Mint Ice

HEX

#364F59

RGB

rgb(54, 79, 89)

HSL

hsl(197, 24%, 28%)

HSB

hsb(197, 39%, 35%)

CMYK

cmyk(39%, 11%, 0%, 65%)

Oklch

oklch(41.1% 0.035 224.8)

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

#5A5B5C

Ink Gray · DimGray · Charcoal

HEX

#5A5B5C

RGB

rgb(90, 91, 92)

HSL

hsl(210, 1%, 36%)

HSB

hsb(210, 2%, 36%)

CMYK

cmyk(2%, 1%, 0%, 64%)

Oklch

oklch(47.1% 0.002 247.9)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1A2F33

321E1A

Analogous

1A322A

1A2F33

1A2232

Triadic

1A2F33

321A2E

2E321A

Split-Comp.

1A2F33

321A22

322A1A

Tetradic

1A2F33

2A1A32

321E1A

22321A

Contrast Matrix WCAG 2.1 Contrast

1A2F33	0D0912	10485D	364F59	5A5B5C
—	1.4 Fail	1.4 Fail	1.6 Fail	2.1 Fail
1.4 Fail	—	2.0 Fail	2.3 Fail	2.9 Fail
1.4 Fail	2.0 Fail	—	1.1 Fail	1.5 Fail
1.6 Fail	2.3 Fail	1.1 Fail	—	1.3 Fail
2.1 Fail	2.9 Fail	1.5 Fail	1.3 Fail	—

White BG

14.0AAA

19.7AAA

10.0AAA

8.7AAA

6.8AA

Black BG

1.5Fail

1.1Fail

2.1Fail

2.4Fail

3.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

232332

0B0B10

282958

414157

5A5A5C

Deuteranopia

222032

0C0C0F

252157

3F3E56

5A5A5C

Tritanopia

1B3131

0D0E0E

135453

375554

5A5C5C

Achromatopsia

292929

0B0B0B

3A3A3A

494949

5B5B5B

Shades & Tints Shades & Tints

#1A2F33

Dark

Light

#0D0912

Dark

Light

#10485D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1a2f33;
  --color-2: #0d0912;
  --color-3: #10485d;
  --color-4: #364f59;
  --color-5: #5a5b5c;
}

SCSS

$color-1: #1a2f33;
$color-2: #0d0912;
$color-3: #10485d;
$color-4: #364f59;
$color-5: #5a5b5c;

TAILWIND

colors: {
  'brand-1': '#1a2f33',
  'brand-2': '#0d0912',
  'brand-3': '#10485d',
  'brand-4': '#364f59',
  'brand-5': '#5a5b5c',
}

RGB Array

[26, 47, 51], [13, 9, 18], [16, 72, 93], [54, 79, 89], [90, 91, 92]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1A2F33, #0D0912, #10485D, #364F59, #5A5B5C 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: #1a2f33; --color-2: #0d0912; --color-3: #10485d; --color-4: #364f59; --color-5: #5a5b5c. 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