#041726 + #162C41 + #36A292 + #09221F + #051508 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#041726

Lake Blue · Black · Deep Sea Blue

HEX

#041726

RGB

rgb(4, 23, 38)

HSL

hsl(206, 81%, 8%)

HSB

hsb(206, 89%, 15%)

CMYK

cmyk(89%, 39%, 0%, 85%)

Oklch

oklch(19.7% 0.040 244.1)

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

#162C41

Slate Blue · DarkSlateGray · Deep Sea Blue

HEX

#162C41

RGB

rgb(22, 44, 65)

HSL

hsl(209, 49%, 17%)

HSB

hsb(209, 66%, 25%)

CMYK

cmyk(66%, 32%, 0%, 75%)

Oklch

oklch(28.6% 0.048 248.8)

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

#36A292

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#36A292

RGB

rgb(54, 162, 146)

HSL

hsl(171, 50%, 42%)

HSB

hsb(171, 67%, 64%)

CMYK

cmyk(67%, 0%, 10%, 36%)

Oklch

oklch(64.7% 0.100 181.3)

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

#09221F

Mineral Blue · Black · Peacock Green

HEX

#09221F

RGB

rgb(9, 34, 31)

HSL

hsl(173, 58%, 8%)

HSB

hsb(173, 74%, 13%)

CMYK

cmyk(74%, 0%, 9%, 87%)

Oklch

oklch(23.1% 0.031 184.7)

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

#051508

Pine Green · Black · Dark Green

HEX

#051508

RGB

rgb(5, 21, 8)

HSL

hsl(131, 62%, 5%)

HSB

hsb(131, 76%, 8%)

CMYK

cmyk(76%, 0%, 62%, 92%)

Oklch

oklch(17.6% 0.035 149.1)

Traditional「Pine Green」· Paint「Dark Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

041726

251204

Analogous

042523

041726

040625

Triadic

041726

250417

172504

Split-Comp.

041726

250406

252304

Tetradic

041726

230425

251204

062504

Contrast Matrix WCAG 2.1 Contrast

041726	162C41	36A292	09221F	051508
—	1.3 Fail	5.8 AA	1.1 Fail	1.0 Fail
1.3 Fail	—	4.6 AA	1.2 Fail	1.3 Fail
5.8 AA	4.6 AA	—	5.3 AA	6.0 AA
1.1 Fail	1.2 Fail	5.3 AA	—	1.1 Fail
1.0 Fail	1.3 Fail	6.0 AA	1.1 Fail	—

White BG

18.2AAA

14.3AAA

3.1AA Large

16.7AAA

18.8AAA

Black BG

1.2Fail

1.5Fail

6.7AA

1.3Fail

1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

0C0C22

20203C

656696

141420

0C0C0B

Deuteranopia

0B0A22

1E1D3B

5F5697

121120

0B0A0C

Tritanopia

05201F

173837

3B999A

0A2020

060E0E

Achromatopsia

131313

282828

808080

1A1A1A

0F0F0F

Shades & Tints Shades & Tints

#041726

Dark

Light

#162C41

Dark

Light

#36A292

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #041726;
  --color-2: #162c41;
  --color-3: #36a292;
  --color-4: #09221f;
  --color-5: #051508;
}

SCSS

$color-1: #041726;
$color-2: #162c41;
$color-3: #36a292;
$color-4: #09221f;
$color-5: #051508;

TAILWIND

colors: {
  'brand-1': '#041726',
  'brand-2': '#162c41',
  'brand-3': '#36a292',
  'brand-4': '#09221f',
  'brand-5': '#051508',
}

RGB Array

[4, 23, 38], [22, 44, 65], [54, 162, 146], [9, 34, 31], [5, 21, 8]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #041726, #162C41, #36A292, #09221F, #051508 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: #041726; --color-2: #162c41; --color-3: #36a292; --color-4: #09221f; --color-5: #051508. 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