← Back to Editor

#020807 · #0C3B35 · #145E55 · #067C6E · #04A08E

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#020807

Mineral Blue · Black · Peacock Green

HEX
#020807
RGB
rgb(2, 8, 7)
HSL
hsl(170, 60%, 2%)
HSB
hsb(170, 75%, 3%)
CMYK
cmyk(75%, 0%, 12%, 97%)
Oklch
oklch(12.5% 0.015 185.1)

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

#0C3B35

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#0C3B35
RGB
rgb(12, 59, 53)
HSL
hsl(172, 66%, 14%)
HSB
hsb(172, 80%, 23%)
CMYK
cmyk(80%, 0%, 10%, 77%)
Oklch
oklch(32.0% 0.050 182.8)

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

#145E55

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#145E55
RGB
rgb(20, 94, 85)
HSL
hsl(173, 65%, 22%)
HSB
hsb(173, 79%, 37%)
CMYK
cmyk(79%, 0%, 10%, 63%)
Oklch
oklch(43.6% 0.071 182.9)

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

#067C6E

Mineral Blue · Teal · Peacock Green

HEX
#067C6E
RGB
rgb(6, 124, 110)
HSL
hsl(173, 91%, 25%)
HSB
hsb(173, 95%, 49%)
CMYK
cmyk(95%, 0%, 11%, 51%)
Oklch
oklch(52.6% 0.093 181.2)

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

#04A08E

Mineral Blue · Teal · Mint Ice

HEX
#04A08E
RGB
rgb(4, 160, 142)
HSL
hsl(173, 95%, 32%)
HSB
hsb(173, 98%, 63%)
CMYK
cmyk(98%, 0%, 11%, 37%)
Oklch
oklch(63.3% 0.113 181.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

020807
080203

Analogous

020804
020807
020608

Triadic

020807
070208
080702

Split-Comp.

020807
080206
080402

Tetradic

020807
040208
080203
060802

Contrast Matrix WCAG 2.1 Contrast

020807
0C3B35
145E55
067C6E
04A08E
—
1.6
Fail
2.7
Fail
4.0
AA Large
6.2
AA
1.6
Fail
—
1.6
Fail
2.4
Fail
3.8
AA Large
2.7
Fail
1.6
Fail
—
1.5
Fail
2.3
Fail
4.0
AA Large
2.4
Fail
1.5
Fail
—
1.6
Fail
6.2
AA
3.8
AA Large
2.3
Fail
1.6
Fail
—
White BG
20.2AAA
12.4AAA
7.6AAA
5.1AA
3.3AA Large
Black BG
1.0Fail
1.7Fail
2.8Fail
4.1AA Large
6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

050507
202136
343557
393A71
484992

Deuteranopia

040407
1E1A37
302A58
322972
3F3393

Tritanopia

020707
0E3838
185959
0C7475
0C9697

Achromatopsia

060606
2C2C2C
474747
575757
6F6F6F

Shades & Tints Shades & Tints

#020807

Dark
Light

#0C3B35

Dark
Light

#145E55

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #020807;
  --color-2: #0c3b35;
  --color-3: #145e55;
  --color-4: #067c6e;
  --color-5: #04a08e;
}

SCSS

$color-1: #020807;
$color-2: #0c3b35;
$color-3: #145e55;
$color-4: #067c6e;
$color-5: #04a08e;

TAILWIND

colors: {
  'brand-1': '#020807',
  'brand-2': '#0c3b35',
  'brand-3': '#145e55',
  'brand-4': '#067c6e',
  'brand-5': '#04a08e',
}

RGB Array

[2, 8, 7], [12, 59, 53], [20, 94, 85], [6, 124, 110], [4, 160, 142]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #020807, #0C3B35, #145E55, #067C6E, #04A08E is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #020807; --color-2: #0c3b35; --color-3: #145e55; --color-4: #067c6e; --color-5: #04a08e. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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