← Back to Editor

#02151A · #003030 · #607860 · #A8A878 · #C5C59F

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

#02151A

Lake Blue · Black · Peacock Green

HEX
#02151A
RGB
rgb(2, 21, 26)
HSL
hsl(193, 86%, 5%)
HSB
hsb(193, 92%, 10%)
CMYK
cmyk(92%, 19%, 0%, 90%)
Oklch
oklch(18.2% 0.029 216.0)

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

#003030

Lake Blue · DarkSlateGray · Peacock Green

HEX
#003030
RGB
rgb(0, 48, 48)
HSL
hsl(180, 100%, 9%)
HSB
hsb(180, 100%, 19%)
CMYK
cmyk(100%, 0%, 0%, 81%)
Oklch
oklch(28.0% 0.048 194.8)

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

#607860

Celadon · DimGray · Olive Green

HEX
#607860
RGB
rgb(96, 120, 96)
HSL
hsl(120, 11%, 42%)
HSB
hsb(120, 20%, 47%)
CMYK
cmyk(20%, 0%, 20%, 53%)
Oklch
oklch(54.6% 0.046 144.9)

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

#A8A878

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#A8A878
RGB
rgb(168, 168, 120)
HSL
hsl(60, 22%, 56%)
HSB
hsb(60, 29%, 66%)
CMYK
cmyk(0%, 0%, 29%, 34%)
Oklch
oklch(72.0% 0.066 107.9)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#C5C59F

Fresh Green · Tan · Sunflower

HEX
#C5C59F
RGB
rgb(197, 197, 159)
HSL
hsl(60, 25%, 70%)
HSB
hsb(60, 19%, 77%)
CMYK
cmyk(0%, 0%, 19%, 23%)
Oklch
oklch(81.4% 0.051 107.5)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

02151A
180702

Analogous

021812
02151A
020818

Triadic

02151A
180213
131802

Split-Comp.

02151A
180208
181202

Tetradic

02151A
120218
180702
081802

Contrast Matrix WCAG 2.1 Contrast

02151A
003030
607860
A8A878
C5C59F
—
1.3
Fail
3.9
AA Large
7.6
AAA
10.5
AAA
1.3
Fail
—
3.0
Fail
5.8
AA
8.1
AAA
3.9
AA Large
3.0
Fail
—
2.0
Fail
2.7
Fail
7.6
AAA
5.8
AA
2.0
Fail
—
1.4
Fail
10.5
AAA
8.1
AAA
2.7
Fail
1.4
Fail
—
White BG
18.7AAA
14.3AAA
4.8AA
2.5Fail
1.8Fail
Black BG
1.1Fail
1.5Fail
4.4AA Large
8.5AAA
11.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0A0A19
151530
6A6B66
A8A884
C5C5A8

Deuteranopia

090819
120E30
696767
A8A886
C5C5AA

Tritanopia

031818
023030
616A6B
A88D8F
C5AFB1

Achromatopsia

101010
222222
6E6E6E
A3A3A3
C1C1C1

Shades & Tints Shades & Tints

#02151A

Dark
Light

#003030

Dark
Light

#607860

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #02151a;
  --color-2: #003030;
  --color-3: #607860;
  --color-4: #a8a878;
  --color-5: #c5c59f;
}

SCSS

$color-1: #02151a;
$color-2: #003030;
$color-3: #607860;
$color-4: #a8a878;
$color-5: #c5c59f;

TAILWIND

colors: {
  'brand-1': '#02151a',
  'brand-2': '#003030',
  'brand-3': '#607860',
  'brand-4': '#a8a878',
  'brand-5': '#c5c59f',
}

RGB Array

[2, 21, 26], [0, 48, 48], [96, 120, 96], [168, 168, 120], [197, 197, 159]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #02151A, #003030, #607860, #A8A878, #C5C59F 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: #02151a; --color-2: #003030; --color-3: #607860; --color-4: #a8a878; --color-5: #c5c59f. 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