← Back to Editor

#051A15 · #3C4F4B · #828282 · #AD8989 · #C98989

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

#051A15

Mineral Blue · Black · Peacock Green

HEX
#051A15
RGB
rgb(5, 26, 21)
HSL
hsl(166, 68%, 6%)
HSB
hsb(166, 81%, 10%)
CMYK
cmyk(81%, 0%, 19%, 90%)
Oklch
oklch(19.8% 0.030 175.6)

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

#3C4F4B

Mineral Blue · DarkSlateGray · Mint Ice

HEX
#3C4F4B
RGB
rgb(60, 79, 75)
HSL
hsl(167, 14%, 27%)
HSB
hsb(167, 24%, 31%)
CMYK
cmyk(24%, 0%, 5%, 69%)
Oklch
oklch(41.0% 0.025 180.7)

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

#828282

Ash · Gray · Warm Gray

HEX
#828282
RGB
rgb(130, 130, 130)
HSL
hsl(0, 0%, 51%)
HSB
hsb(0, 0%, 51%)
CMYK
cmyk(0%, 0%, 0%, 49%)
Oklch
oklch(60.7% 0.000 89.9)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#AD8989

Peach Pink · DarkGray · Coral Red

HEX
#AD8989
RGB
rgb(173, 137, 137)
HSL
hsl(0, 18%, 61%)
HSB
hsb(0, 21%, 68%)
CMYK
cmyk(0%, 21%, 21%, 32%)
Oklch
oklch(66.4% 0.044 18.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#C98989

Peach Pink · DarkSalmon · Coral Red

HEX
#C98989
RGB
rgb(201, 137, 137)
HSL
hsl(0, 37%, 66%)
HSB
hsb(0, 32%, 79%)
CMYK
cmyk(0%, 32%, 32%, 21%)
Oklch
oklch(69.4% 0.079 19.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

051A15
1A050A

Analogous

051A0A
051A15
05141A

Triadic

051A15
15051A
1A1505

Split-Comp.

051A15
1A0514
1A0A05

Tetradic

051A15
0A051A
1A050A
141A05

Contrast Matrix WCAG 2.1 Contrast

051A15
3C4F4B
828282
AD8989
C98989
—
2.1
Fail
4.7
AA
5.8
AA
6.4
AA
2.1
Fail
—
2.3
Fail
2.8
Fail
3.1
AA Large
4.7
AA
2.3
Fail
—
1.2
Fail
1.4
Fail
5.8
AA
2.8
Fail
1.2
Fail
—
1.1
Fail
6.4
AA
3.1
AA Large
1.4
Fail
1.1
Fail
—
White BG
18.0AAA
8.7AAA
3.8AA Large
3.1AA Large
2.8Fail
Black BG
1.2Fail
2.4Fail
5.5AA
6.7AA
7.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0E0E16
44444C
828282
9D9D89
ADAD89

Deuteranopia

0D0B17
43424C
828282
A0A289
B1B689

Tritanopia

061717
3D4D4D
828282
AB8989
C68989

Achromatopsia

131313
494949
828282
949494
9C9C9C

Shades & Tints Shades & Tints

#051A15

Dark
Light

#3C4F4B

Dark
Light

#828282

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #051a15;
  --color-2: #3c4f4b;
  --color-3: #828282;
  --color-4: #ad8989;
  --color-5: #c98989;
}

SCSS

$color-1: #051a15;
$color-2: #3c4f4b;
$color-3: #828282;
$color-4: #ad8989;
$color-5: #c98989;

TAILWIND

colors: {
  'brand-1': '#051a15',
  'brand-2': '#3c4f4b',
  'brand-3': '#828282',
  'brand-4': '#ad8989',
  'brand-5': '#c98989',
}

RGB Array

[5, 26, 21], [60, 79, 75], [130, 130, 130], [173, 137, 137], [201, 137, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #051A15, #3C4F4B, #828282, #AD8989, #C98989 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #051a15; --color-2: #3c4f4b; --color-3: #828282; --color-4: #ad8989; --color-5: #c98989. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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. Restrained colors convey professionalism and trust. 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