← Back to Editor

#556E52 · #6E6E5E · #917373 · #AD7D7D · #CC8585

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#556E52

Celadon · DimGray · Forest Green

HEX
#556E52
RGB
rgb(85, 110, 82)
HSL
hsl(114, 15%, 38%)
HSB
hsb(114, 25%, 43%)
CMYK
cmyk(23%, 0%, 25%, 57%)
Oklch
oklch(51.0% 0.053 142.0)

Traditional「Celadon」· Paint「Forest Green」· Creative Blush Sunrise

#6E6E5E

Autumn Sage · DimGray · Charcoal

HEX
#6E6E5E
RGB
rgb(110, 110, 94)
HSL
hsl(60, 8%, 40%)
HSB
hsb(60, 15%, 43%)
CMYK
cmyk(0%, 0%, 15%, 57%)
Oklch
oklch(53.3% 0.024 107.2)

Traditional「Autumn Sage」· Paint「Charcoal」· Creative Midnight Shadow

#917373

Crimson · Gray · Passion Red

HEX
#917373
RGB
rgb(145, 115, 115)
HSL
hsl(0, 12%, 51%)
HSB
hsb(0, 21%, 57%)
CMYK
cmyk(0%, 21%, 21%, 43%)
Oklch
oklch(58.5% 0.038 18.3)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#AD7D7D

Crimson · Gray · Passion Red

HEX
#AD7D7D
RGB
rgb(173, 125, 125)
HSL
hsl(0, 23%, 58%)
HSB
hsb(0, 28%, 68%)
CMYK
cmyk(0%, 28%, 28%, 32%)
Oklch
oklch(63.7% 0.060 18.9)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#CC8585

Peach Pink · DarkSalmon · Coral Red

HEX
#CC8585
RGB
rgb(204, 133, 133)
HSL
hsl(0, 41%, 66%)
HSB
hsb(0, 35%, 80%)
CMYK
cmyk(0%, 35%, 35%, 20%)
Oklch
oklch(68.9% 0.088 19.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

556E52
6D526F

Analogous

646F52
556E52
526F5E

Triadic

556E52
52556F
6F5255

Split-Comp.

556E52
5E526F
6F5264

Tetradic

556E52
52646F
6D526F
6F5E52

Contrast Matrix WCAG 2.1 Contrast

556E52
6E6E5E
917373
AD7D7D
CC8585
—
1.1
Fail
1.3
Fail
1.6
Fail
1.9
Fail
1.1
Fail
—
1.2
Fail
1.5
Fail
1.8
Fail
1.3
Fail
1.2
Fail
—
1.2
Fail
1.5
Fail
1.6
Fail
1.5
Fail
1.2
Fail
—
1.2
Fail
1.9
Fail
1.8
Fail
1.5
Fail
1.2
Fail
—
White BG
5.6AA
5.2AA
4.3AA Large
3.5AA Large
2.9Fail
Black BG
3.7AA Large
4.1AA Large
4.9AA
6.0AA
7.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

606059
6E6E62
848473
98987D
ADAD85

Deuteranopia

5E5D5A
6E6E63
868873
9B9F7D
B1B785

Tritanopia

565E5F
6E6566
907373
AB7D7D
C88585

Achromatopsia

636363
6C6C6C
7C7C7C
8B8B8B
9A9A9A

Shades & Tints Shades & Tints

#556E52

Dark
Light

#6E6E5E

Dark
Light

#917373

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #556e52;
  --color-2: #6e6e5e;
  --color-3: #917373;
  --color-4: #ad7d7d;
  --color-5: #cc8585;
}

SCSS

$color-1: #556e52;
$color-2: #6e6e5e;
$color-3: #917373;
$color-4: #ad7d7d;
$color-5: #cc8585;

TAILWIND

colors: {
  'brand-1': '#556e52',
  'brand-2': '#6e6e5e',
  'brand-3': '#917373',
  'brand-4': '#ad7d7d',
  'brand-5': '#cc8585',
}

RGB Array

[85, 110, 82], [110, 110, 94], [145, 115, 115], [173, 125, 125], [204, 133, 133]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #556E52, #6E6E5E, #917373, #AD7D7D, #CC8585 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. 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: #556e52; --color-2: #6e6e5e; --color-3: #917373; --color-4: #ad7d7d; --color-5: #cc8585. 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. 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