← Back to Editor

#E6EEEB · #A0BB8E · #586A85 · #474058 · #F2277D

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

#E6EEEB

Jade · Lavender · Mint Green

HEX
#E6EEEB
RGB
rgb(230, 238, 235)
HSL
hsl(157, 19%, 92%)
HSB
hsb(157, 3%, 93%)
CMYK
cmyk(3%, 0%, 1%, 7%)
Oklch
oklch(94.2% 0.009 171.8)

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

#A0BB8E

Celadon · DarkSeaGreen · Apple Green

HEX
#A0BB8E
RGB
rgb(160, 187, 142)
HSL
hsl(96, 25%, 65%)
HSB
hsb(96, 24%, 73%)
CMYK
cmyk(14%, 0%, 24%, 27%)
Oklch
oklch(76.0% 0.069 133.1)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#586A85

Indigo · DimGray · Navy Blue

HEX
#586A85
RGB
rgb(88, 106, 133)
HSL
hsl(216, 20%, 43%)
HSB
hsb(216, 34%, 52%)
CMYK
cmyk(34%, 20%, 0%, 48%)
Oklch
oklch(52.0% 0.048 258.3)

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

#474058

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#474058
RGB
rgb(71, 64, 88)
HSL
hsl(258, 16%, 30%)
HSB
hsb(258, 27%, 35%)
CMYK
cmyk(19%, 27%, 0%, 65%)
Oklch
oklch(38.8% 0.041 297.8)

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

#F2277D

Dark Violet · DeepPink · Rose Pink

HEX
#F2277D
RGB
rgb(242, 39, 125)
HSL
hsl(335, 89%, 55%)
HSB
hsb(335, 84%, 95%)
CMYK
cmyk(0%, 84%, 48%, 5%)
Oklch
oklch(63.3% 0.237 2.7)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E6EEEB
EEE7EA

Analogous

E7EEE8
E6EEEB
E7EEEE

Triadic

E6EEEB
ECE7EE
EEECE7

Split-Comp.

E6EEEB
EEE7EE
EEE8E7

Tetradic

E6EEEB
E8E7EE
EEE7EA
EEEEE7

Contrast Matrix WCAG 2.1 Contrast

E6EEEB
A0BB8E
586A85
474058
F2277D
—
1.8
Fail
4.7
AA
8.3
AAA
3.3
AA Large
1.8
Fail
—
2.6
Fail
4.7
AA
1.9
Fail
4.7
AA
2.6
Fail
—
1.8
Fail
1.4
Fail
8.3
AAA
4.7
AA
1.8
Fail
—
2.5
Fail
3.3
AA Large
1.9
Fail
1.4
Fail
2.5
Fail
—
White BG
1.2Fail
2.1Fail
5.5AA
9.8AAA
3.9AA Large
Black BG
17.8AAA
10.0AAA
3.8AA Large
2.1Fail
5.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9EAEC
ACAC99
60607E
444452
9A9868

Deuteranopia

E9E8EC
AAA89C
5F5D7D
444551
A6B563

Tritanopia

E6ECEC
A1A1A3
597978
474E4D
E85854

Achromatopsia

EBEBEB
AEAEAE
686868
454545
6E6E6E

Shades & Tints Shades & Tints

#E6EEEB

Dark
Light

#A0BB8E

Dark
Light

#586A85

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e6eeeb;
  --color-2: #a0bb8e;
  --color-3: #586a85;
  --color-4: #474058;
  --color-5: #f2277d;
}

SCSS

$color-1: #e6eeeb;
$color-2: #a0bb8e;
$color-3: #586a85;
$color-4: #474058;
$color-5: #f2277d;

TAILWIND

colors: {
  'brand-1': '#e6eeeb',
  'brand-2': '#a0bb8e',
  'brand-3': '#586a85',
  'brand-4': '#474058',
  'brand-5': '#f2277d',
}

RGB Array

[230, 238, 235], [160, 187, 142], [88, 106, 133], [71, 64, 88], [242, 39, 125]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E6EEEB, #A0BB8E, #586A85, #474058, #F2277D 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: #e6eeeb; --color-2: #a0bb8e; --color-3: #586a85; --color-4: #474058; --color-5: #f2277d. 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