← Back to Editor

#160E1D · #21304F · #28616A · #369283 · #6CB98B

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#160E1D

Dark Plum · Black · Dark Purple

HEX
#160E1D
RGB
rgb(22, 14, 29)
HSL
hsl(272, 35%, 8%)
HSB
hsb(272, 52%, 11%)
CMYK
cmyk(24%, 52%, 0%, 89%)
Oklch
oklch(18.2% 0.032 308.0)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

#21304F

Indigo · DarkSlateGray · Prussian Blue

HEX
#21304F
RGB
rgb(33, 48, 79)
HSL
hsl(220, 41%, 22%)
HSB
hsb(220, 58%, 31%)
CMYK
cmyk(58%, 39%, 0%, 69%)
Oklch
oklch(31.2% 0.060 263.7)

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

#28616A

Slate Blue · DarkSlateGray · Mint Ice

HEX
#28616A
RGB
rgb(40, 97, 106)
HSL
hsl(188, 45%, 29%)
HSB
hsb(188, 62%, 42%)
CMYK
cmyk(62%, 8%, 0%, 58%)
Oklch
oklch(45.9% 0.061 209.3)

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

#369283

Mineral Blue · MediumSeaGreen · Mint Ice

HEX
#369283
RGB
rgb(54, 146, 131)
HSL
hsl(170, 46%, 39%)
HSB
hsb(170, 63%, 57%)
CMYK
cmyk(63%, 0%, 10%, 43%)
Oklch
oklch(60.1% 0.089 180.5)

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

#6CB98B

Celadon · DarkSeaGreen · Olive Green

HEX
#6CB98B
RGB
rgb(108, 185, 139)
HSL
hsl(144, 35%, 57%)
HSB
hsb(144, 42%, 73%)
CMYK
cmyk(42%, 0%, 25%, 27%)
Oklch
oklch(72.3% 0.103 156.5)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

160E1D
141C0D

Analogous

0E0D1C
160E1D
1C0D1B

Triadic

160E1D
1C150D
0D1C15

Split-Comp.

160E1D
1B1C0D
0D1C0E

Tetradic

160E1D
1C0E0D
141C0D
0D1B1C

Contrast Matrix WCAG 2.1 Contrast

160E1D
21304F
28616A
369283
6CB98B
—
1.4
Fail
2.7
Fail
5.0
AA
8.0
AAA
1.4
Fail
—
1.9
Fail
3.5
AA Large
5.6
AA
2.7
Fail
1.9
Fail
—
1.9
Fail
3.0
Fail
5.0
AA
3.5
AA Large
1.9
Fail
—
1.6
Fail
8.0
AAA
5.6
AA
3.0
Fail
1.6
Fail
—
White BG
18.8AAA
13.1AAA
7.0AA
3.8AA Large
2.3Fail
Black BG
1.1Fail
1.6Fail
3.0AA Large
5.6AA
9.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

131219
272847
414168
5E5F87
8D8E96

Deuteranopia

131418
272646
3D3967
595288
898399

Tritanopia

161716
224240
2B6666
3B898A
709FA1

Achromatopsia

121212
2F2F2F
515151
757575
9D9D9D

Shades & Tints Shades & Tints

#160E1D

Dark
Light

#21304F

Dark
Light

#28616A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #160e1d;
  --color-2: #21304f;
  --color-3: #28616a;
  --color-4: #369283;
  --color-5: #6cb98b;
}

SCSS

$color-1: #160e1d;
$color-2: #21304f;
$color-3: #28616a;
$color-4: #369283;
$color-5: #6cb98b;

TAILWIND

colors: {
  'brand-1': '#160e1d',
  'brand-2': '#21304f',
  'brand-3': '#28616a',
  'brand-4': '#369283',
  'brand-5': '#6cb98b',
}

RGB Array

[22, 14, 29], [33, 48, 79], [40, 97, 106], [54, 146, 131], [108, 185, 139]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #160E1D, #21304F, #28616A, #369283, #6CB98B is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #160e1d; --color-2: #21304f; --color-3: #28616a; --color-4: #369283; --color-5: #6cb98b. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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