← Back to Editor

#151628 · #D05981 · #325573 · #2F879F · #2A9399

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#151628

Indigo · Black · Deep Sea Blue

HEX
#151628
RGB
rgb(21, 22, 40)
HSL
hsl(237, 31%, 12%)
HSB
hsb(237, 48%, 16%)
CMYK
cmyk(47%, 45%, 0%, 84%)
Oklch
oklch(20.9% 0.036 280.4)

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

#D05981

Dark Violet · LightCoral · Rose Pink

HEX
#D05981
RGB
rgb(208, 89, 129)
HSL
hsl(340, 56%, 58%)
HSB
hsb(340, 57%, 82%)
CMYK
cmyk(0%, 57%, 38%, 18%)
Oklch
oklch(62.5% 0.155 1.6)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#325573

Slate Blue · DarkSlateGray · Prussian Blue

HEX
#325573
RGB
rgb(50, 85, 115)
HSL
hsl(208, 39%, 32%)
HSB
hsb(208, 57%, 45%)
CMYK
cmyk(57%, 26%, 0%, 55%)
Oklch
oklch(43.7% 0.064 245.8)

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

#2F879F

Lake Blue · SteelBlue · Mint Ice

HEX
#2F879F
RGB
rgb(47, 135, 159)
HSL
hsl(193, 54%, 40%)
HSB
hsb(193, 70%, 62%)
CMYK
cmyk(70%, 15%, 0%, 38%)
Oklch
oklch(58.2% 0.089 219.6)

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

#2A9399

Lake Blue · LightSeaGreen · Mint Ice

HEX
#2A9399
RGB
rgb(42, 147, 153)
HSL
hsl(183, 57%, 38%)
HSB
hsb(183, 73%, 60%)
CMYK
cmyk(73%, 4%, 0%, 40%)
Oklch
oklch(60.8% 0.092 200.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

151628
282715

Analogous

152028
151628
1E1528

Triadic

151628
281516
162815

Split-Comp.

151628
281E15
202815

Tetradic

151628
281520
282715
15281E

Contrast Matrix WCAG 2.1 Contrast

151628
D05981
325573
2F879F
2A9399
—
4.6
AA
2.3
Fail
4.3
AA Large
4.9
AA
4.6
AA
—
2.0
Fail
1.1
Fail
1.1
Fail
2.3
Fail
2.0
Fail
—
1.9
Fail
2.1
Fail
4.3
AA Large
1.1
Fail
1.9
Fail
—
1.1
Fail
4.9
AA
1.1
Fail
2.1
Fail
1.1
Fail
—
White BG
17.8AAA
3.9AA Large
7.8AAA
4.1AA Large
3.7AA Large
Black BG
1.2Fail
5.4AA
2.7Fail
5.1AA
5.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

151524
9C9B77
41416C
555699
575898

Deuteranopia

151523
A3AC75
3F3D6A
504998
514A97

Tritanopia

15201F
CA706E
346665
339594
2F9696

Achromatopsia

181818
818181
4E4E4E
6F6F6F
747474

Shades & Tints Shades & Tints

#151628

Dark
Light

#D05981

Dark
Light

#325573

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #151628;
  --color-2: #d05981;
  --color-3: #325573;
  --color-4: #2f879f;
  --color-5: #2a9399;
}

SCSS

$color-1: #151628;
$color-2: #d05981;
$color-3: #325573;
$color-4: #2f879f;
$color-5: #2a9399;

TAILWIND

colors: {
  'brand-1': '#151628',
  'brand-2': '#d05981',
  'brand-3': '#325573',
  'brand-4': '#2f879f',
  'brand-5': '#2a9399',
}

RGB Array

[21, 22, 40], [208, 89, 129], [50, 85, 115], [47, 135, 159], [42, 147, 153]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #151628, #D05981, #325573, #2F879F, #2A9399 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: #151628; --color-2: #d05981; --color-3: #325573; --color-4: #2f879f; --color-5: #2a9399. 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