← Back to Editor

#555E59 · #B6C2AC · #E2DFBE · #F1F3DE · #939377

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#555E59

Ink Gray · DimGray · Charcoal

HEX
#555E59
RGB
rgb(85, 94, 89)
HSL
hsl(147, 5%, 35%)
HSB
hsb(147, 10%, 37%)
CMYK
cmyk(10%, 0%, 5%, 63%)
Oklch
oklch(47.2% 0.014 161.6)

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

#B6C2AC

Celadon · Silver · Apple Green

HEX
#B6C2AC
RGB
rgb(182, 194, 172)
HSL
hsl(93, 15%, 72%)
HSB
hsb(93, 11%, 76%)
CMYK
cmyk(6%, 0%, 11%, 24%)
Oklch
oklch(79.9% 0.033 130.7)

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

#E2DFBE

Fresh Green · Wheat · Lemon Cream

HEX
#E2DFBE
RGB
rgb(226, 223, 190)
HSL
hsl(55, 38%, 82%)
HSB
hsb(55, 16%, 89%)
CMYK
cmyk(0%, 1%, 16%, 11%)
Oklch
oklch(89.7% 0.044 103.0)

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

#F1F3DE

Fresh Green · Beige · Lemon Cream

HEX
#F1F3DE
RGB
rgb(241, 243, 222)
HSL
hsl(66, 47%, 91%)
HSB
hsb(66, 9%, 95%)
CMYK
cmyk(1%, 0%, 9%, 5%)
Oklch
oklch(95.7% 0.028 111.3)

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

#939377

Autumn Sage · Gray · Sunflower

HEX
#939377
RGB
rgb(147, 147, 119)
HSL
hsl(60, 11%, 52%)
HSB
hsb(60, 19%, 58%)
CMYK
cmyk(0%, 0%, 19%, 42%)
Oklch
oklch(65.6% 0.040 107.5)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

555E59
5E555A

Analogous

555E55
555E59
555E5D

Triadic

555E59
59555E
5E5955

Split-Comp.

555E59
5D555E
5E5555

Tetradic

555E59
55555E
5E555A
5E5D55

Contrast Matrix WCAG 2.1 Contrast

555E59
B6C2AC
E2DFBE
F1F3DE
939377
—
3.6
AA Large
5.0
AA
5.9
AA
2.1
Fail
3.6
AA Large
—
1.4
Fail
1.6
Fail
1.7
Fail
5.0
AA
1.4
Fail
—
1.2
Fail
2.3
Fail
5.9
AA
1.6
Fail
1.2
Fail
—
2.8
Fail
2.1
Fail
1.7
Fail
2.3
Fail
2.8
Fail
—
White BG
6.7AA
1.9Fail
1.4Fail
1.1Fail
3.1AA Large
Black BG
3.1AA Large
11.3AAA
15.5AAA
18.6AAA
6.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

59595A
BBBBB1
E1E1C6
F2F2E3
93937E

Deuteranopia

58585B
BBBAB3
E1E1C8
F2F2E4
93937F

Tritanopia

555B5B
B7B6B6
E2CCCE
F1E7E8
938384

Achromatopsia

5B5B5B
BCBCBC
DCDCDC
F0F0F0
909090

Shades & Tints Shades & Tints

#555E59

Dark
Light

#B6C2AC

Dark
Light

#E2DFBE

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #555e59;
  --color-2: #b6c2ac;
  --color-3: #e2dfbe;
  --color-4: #f1f3de;
  --color-5: #939377;
}

SCSS

$color-1: #555e59;
$color-2: #b6c2ac;
$color-3: #e2dfbe;
$color-4: #f1f3de;
$color-5: #939377;

TAILWIND

colors: {
  'brand-1': '#555e59',
  'brand-2': '#b6c2ac',
  'brand-3': '#e2dfbe',
  'brand-4': '#f1f3de',
  'brand-5': '#939377',
}

RGB Array

[85, 94, 89], [182, 194, 172], [226, 223, 190], [241, 243, 222], [147, 147, 119]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #555E59, #B6C2AC, #E2DFBE, #F1F3DE, #939377 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, 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: #555e59; --color-2: #b6c2ac; --color-3: #e2dfbe; --color-4: #f1f3de; --color-5: #939377. 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 beauty, lifestyle, arts 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