← Back to Editor

#EEDEED · #BCAAA9 · #50535A · #3C5D7C · #E5E6E1

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

#EEDEED

Mauve · Lavender · Lavender

HEX
#EEDEED
RGB
rgb(238, 222, 237)
HSL
hsl(304, 32%, 90%)
HSB
hsb(304, 7%, 93%)
CMYK
cmyk(0%, 7%, 0%, 7%)
Oklch
oklch(91.8% 0.026 327.7)

Traditional「Mauve」· Paint「Lavender」· Creative Rose Petal

#BCAAA9

Peach Pink · DarkGray · Coral Red

HEX
#BCAAA9
RGB
rgb(188, 170, 169)
HSL
hsl(3, 12%, 70%)
HSB
hsb(3, 10%, 74%)
CMYK
cmyk(0%, 10%, 10%, 26%)
Oklch
oklch(75.3% 0.021 21.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#50535A

Ink Gray · DarkSlateGray · Charcoal

HEX
#50535A
RGB
rgb(80, 83, 90)
HSL
hsl(222, 6%, 33%)
HSB
hsb(222, 11%, 35%)
CMYK
cmyk(11%, 8%, 0%, 65%)
Oklch
oklch(44.2% 0.012 267.2)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#3C5D7C

Slate Blue · DarkSlateBlue · Prussian Blue

HEX
#3C5D7C
RGB
rgb(60, 93, 124)
HSL
hsl(209, 35%, 36%)
HSB
hsb(209, 52%, 49%)
CMYK
cmyk(52%, 25%, 0%, 51%)
Oklch
oklch(46.7% 0.064 247.8)

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

#E5E6E1

Willow Green · Beige · Cloud White

HEX
#E5E6E1
RGB
rgb(229, 230, 225)
HSL
hsl(72, 9%, 89%)
HSB
hsb(72, 2%, 90%)
CMYK
cmyk(0%, 0%, 2%, 10%)
Oklch
oklch(92.3% 0.007 115.7)

Traditional「Willow Green」· Paint「Cloud White」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EEDEED
DDEEDE

Analogous

E7DDEE
EEDEED
EEDDE4

Triadic

EEDEED
EDEEDD
DDEDEE

Split-Comp.

EEDEED
E4EEDD
DDEEE7

Tetradic

EEDEED
EEE7DD
DDEEDE
DDE4EE

Contrast Matrix WCAG 2.1 Contrast

EEDEED
BCAAA9
50535A
3C5D7C
E5E6E1
—
1.7
Fail
6.0
AA
5.3
AA
1.0
Fail
1.7
Fail
—
3.5
AA Large
3.1
AA Large
1.8
Fail
6.0
AA
3.5
AA Large
—
1.1
Fail
6.1
AA
5.3
AA
3.1
AA Large
1.1
Fail
—
5.5
AA
1.0
Fail
1.8
Fail
6.1
AA
5.5
AA
—
White BG
1.3Fail
2.2Fail
7.7AAA
6.9AA
1.3Fail
Black BG
16.3AAA
9.5AAA
2.7Fail
3.0AA Large
16.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E7E7E9
B4B4A9
515158
4A4B74
E5E5E2

Deuteranopia

E8E9E8
B5B7A9
515158
484673
E5E5E3

Tritanopia

EDE7E6
BBA9A9
505757
3E6F6D
E5E3E3

Achromatopsia

E4E4E4
AFAFAF
535353
575757
E5E5E5

Shades & Tints Shades & Tints

#EEDEED

Dark
Light

#BCAAA9

Dark
Light

#50535A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #eedeed;
  --color-2: #bcaaa9;
  --color-3: #50535a;
  --color-4: #3c5d7c;
  --color-5: #e5e6e1;
}

SCSS

$color-1: #eedeed;
$color-2: #bcaaa9;
$color-3: #50535a;
$color-4: #3c5d7c;
$color-5: #e5e6e1;

TAILWIND

colors: {
  'brand-1': '#eedeed',
  'brand-2': '#bcaaa9',
  'brand-3': '#50535a',
  'brand-4': '#3c5d7c',
  'brand-5': '#e5e6e1',
}

RGB Array

[238, 222, 237], [188, 170, 169], [80, 83, 90], [60, 93, 124], [229, 230, 225]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EEDEED, #BCAAA9, #50535A, #3C5D7C, #E5E6E1 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: #eedeed; --color-2: #bcaaa9; --color-3: #50535a; --color-4: #3c5d7c; --color-5: #e5e6e1. 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