#111922 + #122837 + #0F505D + #386E77 + #579798 · space - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#111922

Indigo · Black · Deep Sea Blue

HEX

#111922

RGB

rgb(17, 25, 34)

HSL

hsl(212, 33%, 10%)

HSB

hsb(212, 50%, 13%)

CMYK

cmyk(50%, 26%, 0%, 87%)

Oklch

oklch(21.0% 0.022 251.8)

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

#122837

Lake Blue · DarkSlateGray · Deep Sea Blue

HEX

#122837

RGB

rgb(18, 40, 55)

HSL

hsl(204, 51%, 14%)

HSB

hsb(204, 67%, 22%)

CMYK

cmyk(67%, 27%, 0%, 78%)

Oklch

oklch(26.6% 0.040 240.3)

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

#0F505D

Lake Blue · DarkSlateGray · Peacock Green

HEX

#0F505D

RGB

rgb(15, 80, 93)

HSL

hsl(190, 72%, 21%)

HSB

hsb(190, 84%, 36%)

CMYK

cmyk(84%, 14%, 0%, 64%)

Oklch

oklch(39.9% 0.065 214.8)

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

#386E77

Slate Blue · SeaGreen · Mint Ice

HEX

#386E77

RGB

rgb(56, 110, 119)

HSL

hsl(189, 36%, 34%)

HSB

hsb(189, 53%, 47%)

CMYK

cmyk(53%, 8%, 0%, 53%)

Oklch

oklch(50.5% 0.059 209.5)

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

#579798

Slate Blue · CadetBlue · Mint Ice

HEX

#579798

RGB

rgb(87, 151, 152)

HSL

hsl(181, 27%, 47%)

HSB

hsb(181, 43%, 60%)

CMYK

cmyk(43%, 1%, 0%, 40%)

Oklch

oklch(63.4% 0.066 196.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

111922

221A11

Analogous

112122

111922

121122

Triadic

111922

221119

192211

Split-Comp.

111922

221211

212211

Tetradic

111922

221121

221A11

112212

Contrast Matrix WCAG 2.1 Contrast

111922	122837	0F505D	386E77	579798
—	1.2 Fail	2.0 Fail	3.1 AA Large	5.3 AA
1.2 Fail	—	1.7 Fail	2.6 Fail	4.5 AA
2.0 Fail	1.7 Fail	—	1.6 Fail	2.7 Fail
3.1 AA Large	2.6 Fail	1.6 Fail	—	1.7 Fail
5.3 AA	4.5 AA	2.7 Fail	1.7 Fail	—

White BG

17.7AAA

15.2AAA

9.0AAA

5.7AA

3.3AA Large

Black BG

1.2Fail

1.4Fail

2.3Fail

3.7AA Large

6.3AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

141520

1C1C33

2B2C5A

4F5075

737398

Deuteranopia

14131F

1A1933

272359

4C4874

6F6A98

Tritanopia

111E1E

133130

125757

3B7373

5A9898

Achromatopsia

181818

232323

3E3E3E

5F5F5F

848484

Shades & Tints Shades & Tints

#111922

Dark

Light

#122837

Dark

Light

#0F505D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #111922;
  --color-2: #122837;
  --color-3: #0f505d;
  --color-4: #386e77;
  --color-5: #579798;
}

SCSS

$color-1: #111922;
$color-2: #122837;
$color-3: #0f505d;
$color-4: #386e77;
$color-5: #579798;

TAILWIND

colors: {
  'brand-1': '#111922',
  'brand-2': '#122837',
  'brand-3': '#0f505d',
  'brand-4': '#386e77',
  'brand-5': '#579798',
}

RGB Array

[17, 25, 34], [18, 40, 55], [15, 80, 93], [56, 110, 119], [87, 151, 152]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #111922, #122837, #0F505D, #386E77, #579798 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: #111922; --color-2: #122837; --color-3: #0f505d; --color-4: #386e77; --color-5: #579798. 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 space-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