← Back to Editor

#5F5354 · #898A92 · #A6AEA6 · #C48D92 · #E64C2E

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 Library

Color Details Color Details

#5F5354

Ink Gray · DimGray · Charcoal

HEX
#5F5354
RGB
rgb(95, 83, 84)
HSL
hsl(355, 7%, 35%)
HSB
hsb(355, 13%, 37%)
CMYK
cmyk(0%, 13%, 12%, 63%)
Oklch
oklch(45.4% 0.016 12.0)

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

#898A92

Ash · LightSlateGray · Warm Gray

HEX
#898A92
RGB
rgb(137, 138, 146)
HSL
hsl(233, 4%, 55%)
HSB
hsb(233, 6%, 57%)
CMYK
cmyk(6%, 5%, 0%, 43%)
Oklch
oklch(63.5% 0.012 280.4)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#A6AEA6

Ash · DarkGray · Silver Sand

HEX
#A6AEA6
RGB
rgb(166, 174, 166)
HSL
hsl(120, 5%, 67%)
HSB
hsb(120, 5%, 68%)
CMYK
cmyk(5%, 0%, 5%, 32%)
Oklch
oklch(74.2% 0.014 145.4)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#C48D92

Peach Pink · Tan · Coral Red

HEX
#C48D92
RGB
rgb(196, 141, 146)
HSL
hsl(355, 32%, 66%)
HSB
hsb(355, 28%, 77%)
CMYK
cmyk(0%, 28%, 26%, 23%)
Oklch
oklch(69.8% 0.067 12.9)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#E64C2E

Vermilion · Chocolate · Passion Red

HEX
#E64C2E
RGB
rgb(230, 76, 46)
HSL
hsl(10, 79%, 54%)
HSB
hsb(10, 80%, 90%)
CMYK
cmyk(0%, 67%, 80%, 10%)
Oklch
oklch(62.8% 0.195 33.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5F5354
535F5E

Analogous

5F535A
5F5354
5F5853

Triadic

5F5354
545F53
53545F

Split-Comp.

5F5354
535F58
535A5F

Tetradic

5F5354
5A5F53
535F5E
58535F

Contrast Matrix WCAG 2.1 Contrast

5F5354
898A92
A6AEA6
C48D92
E64C2E
—
2.1
Fail
3.2
AA Large
2.7
Fail
1.9
Fail
2.1
Fail
—
1.5
Fail
1.2
Fail
1.1
Fail
3.2
AA Large
1.5
Fail
—
1.2
Fail
1.7
Fail
2.7
Fail
1.2
Fail
1.2
Fail
—
1.4
Fail
1.9
Fail
1.1
Fail
1.7
Fail
1.4
Fail
—
White BG
7.4AAA
3.4AA Large
2.3Fail
2.8Fail
3.9AA Large
Black BG
2.9Fail
6.1AA
9.2AAA
7.6AAA
5.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5A5A54
898990
A9AAA8
ACAC91
A3A235

Deuteranopia

5B5B54
898990
A9A8A8
AFB491
ACB837

Tritanopia

5E5454
898F8E
A6A9AA
C19090
DE3B3C

Achromatopsia

575757
8B8B8B
ABABAB
9E9E9E
777777

Shades & Tints Shades & Tints

#5F5354

Dark
Light

#898A92

Dark
Light

#A6AEA6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5f5354;
  --color-2: #898a92;
  --color-3: #a6aea6;
  --color-4: #c48d92;
  --color-5: #e64c2e;
}

SCSS

$color-1: #5f5354;
$color-2: #898a92;
$color-3: #a6aea6;
$color-4: #c48d92;
$color-5: #e64c2e;

TAILWIND

colors: {
  'brand-1': '#5f5354',
  'brand-2': '#898a92',
  'brand-3': '#a6aea6',
  'brand-4': '#c48d92',
  'brand-5': '#e64c2e',
}

RGB Array

[95, 83, 84], [137, 138, 146], [166, 174, 166], [196, 141, 146], [230, 76, 46]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5F5354, #898A92, #A6AEA6, #C48D92, #E64C2E 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: #5f5354; --color-2: #898a92; --color-3: #a6aea6; --color-4: #c48d92; --color-5: #e64c2e. 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