← Back to Editor

#020205 · #081EA8 · #848FBA · #C1C7C3 · #FFFFCC

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

#020205

Deep Indigo · Black · Deep Sea Blue

HEX
#020205
RGB
rgb(2, 2, 5)
HSL
hsl(240, 43%, 1%)
HSB
hsb(240, 60%, 2%)
CMYK
cmyk(60%, 60%, 0%, 98%)
Oklch
oklch(8.8% 0.014 283.2)

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

#081EA8

Indigo · MediumBlue · Prussian Blue

HEX
#081EA8
RGB
rgb(8, 30, 168)
HSL
hsl(232, 91%, 35%)
HSB
hsb(232, 95%, 66%)
CMYK
cmyk(95%, 82%, 0%, 34%)
Oklch
oklch(35.7% 0.212 265.2)

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

#848FBA

Azure · LightSlateGray · Cobalt Blue

HEX
#848FBA
RGB
rgb(132, 143, 186)
HSL
hsl(228, 28%, 62%)
HSB
hsb(228, 29%, 73%)
CMYK
cmyk(29%, 23%, 0%, 27%)
Oklch
oklch(65.7% 0.065 273.3)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#C1C7C3

Silver Gray · Silver · Pearl Gray

HEX
#C1C7C3
RGB
rgb(193, 199, 195)
HSL
hsl(140, 5%, 77%)
HSB
hsb(140, 3%, 78%)
CMYK
cmyk(3%, 0%, 2%, 22%)
Oklch
oklch(82.4% 0.009 157.1)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#FFFFCC

Fresh Green · LightYellow · Lemon Cream

HEX
#FFFFCC
RGB
rgb(255, 255, 204)
HSL
hsl(60, 100%, 90%)
HSB
hsb(60, 20%, 100%)
CMYK
cmyk(0%, 0%, 20%, 0%)
Oklch
oklch(98.8% 0.065 107.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

020205
040401

Analogous

010304
020205
030104

Triadic

020205
040101
010401

Split-Comp.

020205
040301
030401

Tetradic

020205
040103
040401
010403

Contrast Matrix WCAG 2.1 Contrast

020205
081EA8
848FBA
C1C7C3
FFFFCC
—
1.7
Fail
6.5
AA
12.1
AAA
20.2
AAA
1.7
Fail
—
3.8
AA Large
6.9
AA
11.6
AAA
6.5
AA
3.8
AA Large
—
1.8
Fail
3.1
AA Large
12.1
AAA
6.9
AA
1.8
Fail
—
1.7
Fail
20.2
AAA
11.6
AAA
3.1
AA Large
1.7
Fail
—
White BG
20.7AAA
11.9AAA
3.2AA Large
1.7Fail
1.0Fail
Black BG
1.0Fail
1.8Fail
6.6AA
12.2AAA
20.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

020204
121287
8989B0
C4C4C4
FFFFD8

Deuteranopia

020204
100F7F
8887AD
C3C3C4
FFFFDB

Tritanopia

020404
096C66
85A7A6
C1C5C5
FFE2E4

Achromatopsia

020202
272727
919191
C5C5C5
F9F9F9

Shades & Tints Shades & Tints

#020205

Dark
Light

#081EA8

Dark
Light

#848FBA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #020205;
  --color-2: #081ea8;
  --color-3: #848fba;
  --color-4: #c1c7c3;
  --color-5: #ffffcc;
}

SCSS

$color-1: #020205;
$color-2: #081ea8;
$color-3: #848fba;
$color-4: #c1c7c3;
$color-5: #ffffcc;

TAILWIND

colors: {
  'brand-1': '#020205',
  'brand-2': '#081ea8',
  'brand-3': '#848fba',
  'brand-4': '#c1c7c3',
  'brand-5': '#ffffcc',
}

RGB Array

[2, 2, 5], [8, 30, 168], [132, 143, 186], [193, 199, 195], [255, 255, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #020205, #081EA8, #848FBA, #C1C7C3, #FFFFCC is ideal for: 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: #020205; --color-2: #081ea8; --color-3: #848fba; --color-4: #c1c7c3; --color-5: #ffffcc. 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. 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