← Back to Editor

#060118 · #0A1C46 · #006475 · #7FC8B0 · #CBDCD6

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 AppData Visualization

Color Details Color Details

#060118

Deep Indigo · Black · Deep Sea Blue

HEX
#060118
RGB
rgb(6, 1, 24)
HSL
hsl(253, 92%, 5%)
HSB
hsb(253, 96%, 9%)
CMYK
cmyk(75%, 96%, 0%, 91%)
Oklch
oklch(11.5% 0.057 290.5)

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

#0A1C46

Indigo · MidnightBlue · Deep Sea Blue

HEX
#0A1C46
RGB
rgb(10, 28, 70)
HSL
hsl(222, 75%, 16%)
HSB
hsb(222, 86%, 27%)
CMYK
cmyk(86%, 60%, 0%, 73%)
Oklch
oklch(24.1% 0.083 263.8)

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

#006475

Lake Blue · Teal · Peacock Green

HEX
#006475
RGB
rgb(0, 100, 117)
HSL
hsl(189, 100%, 23%)
HSB
hsb(189, 100%, 46%)
CMYK
cmyk(100%, 15%, 0%, 54%)
Oklch
oklch(46.3% 0.082 214.6)

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

#7FC8B0

Jade · MediumAquaMarine · Lake Green

HEX
#7FC8B0
RGB
rgb(127, 200, 176)
HSL
hsl(160, 40%, 64%)
HSB
hsb(160, 37%, 78%)
CMYK
cmyk(37%, 0%, 12%, 22%)
Oklch
oklch(77.8% 0.081 171.3)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#CBDCD6

Jade · LightGray · Mint Green

HEX
#CBDCD6
RGB
rgb(203, 220, 214)
HSL
hsl(159, 20%, 83%)
HSB
hsb(159, 8%, 86%)
CMYK
cmyk(8%, 0%, 3%, 14%)
Oklch
oklch(88.0% 0.020 172.7)

Traditional「Jade」· Paint「Mint Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

060118
131801

Analogous

010818
060118
120118

Triadic

060118
180601
011806

Split-Comp.

060118
181201
081801

Tetradic

060118
180108
131801
011812

Contrast Matrix WCAG 2.1 Contrast

060118
0A1C46
006475
7FC8B0
CBDCD6
—
1.2
Fail
3.0
AA Large
10.5
AAA
14.4
AAA
1.2
Fail
—
2.4
Fail
8.5
AAA
11.6
AAA
3.0
AA Large
2.4
Fail
—
3.5
AA Large
4.8
AA
10.5
AAA
8.5
AAA
3.5
AA Large
—
1.4
Fail
14.4
AAA
11.6
AAA
4.8
AA
1.4
Fail
—
White BG
20.5AAA
16.6AAA
6.8AA
1.9Fail
1.4Fail
Black BG
1.0Fail
1.3Fail
3.1AA Large
10.8AAA
14.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

040412
12123C
2B2C71
9F9FB6
D2D3D7

Deuteranopia

040411
110F39
261E70
9A95B7
D1D0D8

Tritanopia

060E0D
0B3432
056E6D
83BABB
CCD9D9

Achromatopsia

050505
1B1B1B
484848
AFAFAF
D6D6D6

Shades & Tints Shades & Tints

#060118

Dark
Light

#0A1C46

Dark
Light

#006475

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #060118;
  --color-2: #0a1c46;
  --color-3: #006475;
  --color-4: #7fc8b0;
  --color-5: #cbdcd6;
}

SCSS

$color-1: #060118;
$color-2: #0a1c46;
$color-3: #006475;
$color-4: #7fc8b0;
$color-5: #cbdcd6;

TAILWIND

colors: {
  'brand-1': '#060118',
  'brand-2': '#0a1c46',
  'brand-3': '#006475',
  'brand-4': '#7fc8b0',
  'brand-5': '#cbdcd6',
}

RGB Array

[6, 1, 24], [10, 28, 70], [0, 100, 117], [127, 200, 176], [203, 220, 214]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #060118, #0A1C46, #006475, #7FC8B0, #CBDCD6 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #060118; --color-2: #0a1c46; --color-3: #006475; --color-4: #7fc8b0; --color-5: #cbdcd6. 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 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