← Back to Editor

#EEEEEE · #8D9DAB · #485663 · #202020 · #FFFFFF

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

#EEEEEE

Plain White · Linen · Cloud White

HEX
#EEEEEE
RGB
rgb(238, 238, 238)
HSL
hsl(0, 0%, 93%)
HSB
hsb(0, 0%, 93%)
CMYK
cmyk(0%, 0%, 0%, 7%)
Oklch
oklch(94.9% 0.000 89.9)

Traditional「Plain White」· Paint「Cloud White」· Creative Morning Mist

#8D9DAB

Sky Blue · DarkGray · Cobalt Blue

HEX
#8D9DAB
RGB
rgb(141, 157, 171)
HSL
hsl(208, 15%, 61%)
HSB
hsb(208, 18%, 67%)
CMYK
cmyk(18%, 8%, 0%, 33%)
Oklch
oklch(68.8% 0.028 244.6)

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

#485663

Slate Blue · DarkSlateGray · Prussian Blue

HEX
#485663
RGB
rgb(72, 86, 99)
HSL
hsl(209, 16%, 34%)
HSB
hsb(209, 27%, 39%)
CMYK
cmyk(27%, 13%, 0%, 61%)
Oklch
oklch(44.6% 0.028 246.5)

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

#202020

Ink Black · Black · Dark Stone

HEX
#202020
RGB
rgb(32, 32, 32)
HSL
hsl(0, 0%, 13%)
HSB
hsb(0, 0%, 13%)
CMYK
cmyk(0%, 0%, 0%, 87%)
Oklch
oklch(24.4% 0.000 89.9)

Traditional「Ink Black」· Paint「Dark Stone」· Creative Midnight Shadow

#FFFFFF

Moonlight White · White · Cloud White

HEX
#FFFFFF
RGB
rgb(255, 255, 255)
HSL
hsl(0, 0%, 100%)
HSB
hsb(0, 0%, 100%)
CMYK
cmyk(0%, 0%, 0%, 0%)
Oklch
oklch(100.0% 0.000 89.9)

Traditional「Moonlight White」· Paint「Cloud White」· Creative Morning Mist

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EEEEEE
EDEDED

Analogous

EDEDED
EEEEEE
EDEDED

Triadic

EEEEEE
EDEDED
EDEDED

Split-Comp.

EEEEEE
EDEDED
EDEDED

Tetradic

EEEEEE
EDEDED
EDEDED
EDEDED

Contrast Matrix WCAG 2.1 Contrast

EEEEEE
8D9DAB
485663
202020
FFFFFF
—
2.4
Fail
6.5
AA
14.0
AAA
1.2
Fail
2.4
Fail
—
2.7
Fail
5.9
AA
2.8
Fail
6.5
AA
2.7
Fail
—
2.2
Fail
7.5
AAA
14.0
AAA
5.9
AA
2.2
Fail
—
16.3
AAA
1.2
Fail
2.8
Fail
7.5
AAA
16.3
AAA
—
White BG
1.2Fail
2.8Fail
7.5AAA
16.3AAA
1.0Fail
Black BG
18.1AAA
7.5AAA
2.8Fail
1.3Fail
21.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EEEEEE
9494A8
4E4E60
202020
FFFFFF

Deuteranopia

EEEEEE
9392A7
4D4C5F
202020
FFFFFF

Tritanopia

EEEEEE
8EA5A4
495D5D
202020
FFFFFF

Achromatopsia

EEEEEE
9A9A9A
535353
202020
FFFFFF

Shades & Tints Shades & Tints

#EEEEEE

Dark
Light

#8D9DAB

Dark
Light

#485663

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #eeeeee;
  --color-2: #8d9dab;
  --color-3: #485663;
  --color-4: #202020;
  --color-5: #ffffff;
}

SCSS

$color-1: #eeeeee;
$color-2: #8d9dab;
$color-3: #485663;
$color-4: #202020;
$color-5: #ffffff;

TAILWIND

colors: {
  'brand-1': '#eeeeee',
  'brand-2': '#8d9dab',
  'brand-3': '#485663',
  'brand-4': '#202020',
  'brand-5': '#ffffff',
}

RGB Array

[238, 238, 238], [141, 157, 171], [72, 86, 99], [32, 32, 32], [255, 255, 255]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EEEEEE, #8D9DAB, #485663, #202020, #FFFFFF 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: #eeeeee; --color-2: #8d9dab; --color-3: #485663; --color-4: #202020; --color-5: #ffffff. 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