← Back to Editor

#B0BECD · #56595C · #EDEFF2 · #96CD47 · #E9F580

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#B0BECD

Azure · LightSteelBlue · Cobalt Blue

HEX
#B0BECD
RGB
rgb(176, 190, 205)
HSL
hsl(211, 22%, 75%)
HSB
hsb(211, 14%, 80%)
CMYK
cmyk(14%, 7%, 0%, 20%)
Oklch
oklch(79.5% 0.026 250.0)

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

#56595C

Ink Gray · DimGray · Charcoal

HEX
#56595C
RGB
rgb(86, 89, 92)
HSL
hsl(210, 3%, 35%)
HSB
hsb(210, 7%, 36%)
CMYK
cmyk(7%, 3%, 0%, 64%)
Oklch
oklch(46.2% 0.006 248.0)

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

#EDEFF2

Azure · Lavender · Sky Blue

HEX
#EDEFF2
RGB
rgb(237, 239, 242)
HSL
hsl(216, 16%, 94%)
HSB
hsb(216, 2%, 95%)
CMYK
cmyk(2%, 1%, 0%, 5%)
Oklch
oklch(95.1% 0.005 258.3)

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

#96CD47

Grass Green · GreenYellow · Olive Green

HEX
#96CD47
RGB
rgb(150, 205, 71)
HSL
hsl(85, 57%, 54%)
HSB
hsb(85, 65%, 80%)
CMYK
cmyk(27%, 0%, 65%, 20%)
Oklch
oklch(78.4% 0.172 128.9)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#E9F580

Fresh Green · Khaki · Sunflower

HEX
#E9F580
RGB
rgb(233, 245, 128)
HSL
hsl(66, 85%, 73%)
HSB
hsb(66, 48%, 96%)
CMYK
cmyk(5%, 0%, 48%, 4%)
Oklch
oklch(93.7% 0.142 114.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B0BECD
CDC0B1

Analogous

B1CDCD
B0BECD
B2B1CD

Triadic

B0BECD
CDB1BF
BFCDB1

Split-Comp.

B0BECD
CDB2B1
CDCDB1

Tetradic

B0BECD
CDB1CD
CDC0B1
B1CDB2

Contrast Matrix WCAG 2.1 Contrast

B0BECD
56595C
EDEFF2
96CD47
E9F580
—
3.7
AA Large
1.6
Fail
1.0
Fail
1.6
Fail
3.7
AA Large
—
6.1
AA
3.7
AA Large
6.0
AA
1.6
Fail
6.1
AA
—
1.6
Fail
1.0
Fail
1.0
Fail
3.7
AA Large
1.6
Fail
—
1.6
Fail
1.6
Fail
6.0
AA
1.0
Fail
1.6
Fail
—
White BG
1.9Fail
7.0AAA
1.2Fail
1.9Fail
1.2Fail
Black BG
11.1AAA
3.0Fail
18.2AAA
11.1AAA
17.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B6B6C9
57575B
EEEEF1
AEAE67
EEEE9C

Deuteranopia

B5B4C9
57575B
EEEEF1
ABA76F
EEEDA3

Tritanopia

B1C7C6
565B5B
EDF1F1
998187
EAB3B8

Achromatopsia

BCBCBC
585858
EFEFEF
ADADAD
E4E4E4

Shades & Tints Shades & Tints

#B0BECD

Dark
Light

#56595C

Dark
Light

#EDEFF2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b0becd;
  --color-2: #56595c;
  --color-3: #edeff2;
  --color-4: #96cd47;
  --color-5: #e9f580;
}

SCSS

$color-1: #b0becd;
$color-2: #56595c;
$color-3: #edeff2;
$color-4: #96cd47;
$color-5: #e9f580;

TAILWIND

colors: {
  'brand-1': '#b0becd',
  'brand-2': '#56595c',
  'brand-3': '#edeff2',
  'brand-4': '#96cd47',
  'brand-5': '#e9f580',
}

RGB Array

[176, 190, 205], [86, 89, 92], [237, 239, 242], [150, 205, 71], [233, 245, 128]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B0BECD, #56595C, #EDEFF2, #96CD47, #E9F580 is ideal for: health products, baby brands, fresh-style blogs, 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: #b0becd; --color-2: #56595c; --color-3: #edeff2; --color-4: #96cd47; --color-5: #e9f580. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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