← Back to Editor

#9C9C9C · #FFE5F5 · #BEAEAF · #A8989B · #857278

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

#9C9C9C

Ash · DarkGray · Silver Sand

HEX
#9C9C9C
RGB
rgb(156, 156, 156)
HSL
hsl(0, 0%, 61%)
HSB
hsb(0, 0%, 61%)
CMYK
cmyk(0%, 0%, 0%, 39%)
Oklch
oklch(69.3% 0.000 89.9)

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

#FFE5F5

Mauve · SeaShell · Cherry Blossom

HEX
#FFE5F5
RGB
rgb(255, 229, 245)
HSL
hsl(323, 100%, 95%)
HSB
hsb(323, 10%, 100%)
CMYK
cmyk(0%, 10%, 4%, 0%)
Oklch
oklch(94.8% 0.035 340.3)

Traditional「Mauve」· Paint「Cherry Blossom」· Creative Rose Petal

#BEAEAF

Peach Pink · DarkGray · Coral Red

HEX
#BEAEAF
RGB
rgb(190, 174, 175)
HSL
hsl(356, 11%, 71%)
HSB
hsb(356, 8%, 75%)
CMYK
cmyk(0%, 8%, 8%, 25%)
Oklch
oklch(76.5% 0.018 13.2)

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

#A8989B

Peach Pink · DarkGray · Silver Sand

HEX
#A8989B
RGB
rgb(168, 152, 155)
HSL
hsl(349, 8%, 63%)
HSB
hsb(349, 10%, 66%)
CMYK
cmyk(0%, 10%, 8%, 34%)
Oklch
oklch(69.5% 0.019 4.8)

Traditional「Peach Pink」· Paint「Silver Sand」· Creative Urban Concrete

#857278

Dark Violet · Gray · Warm Gray

HEX
#857278
RGB
rgb(133, 114, 120)
HSL
hsl(341, 8%, 48%)
HSB
hsb(341, 14%, 52%)
CMYK
cmyk(0%, 14%, 10%, 48%)
Oklch
oklch(57.2% 0.025 356.9)

Traditional「Dark Violet」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9C9C9C
9C9C9C

Analogous

9C9C9C
9C9C9C
9C9C9C

Triadic

9C9C9C
9C9C9C
9C9C9C

Split-Comp.

9C9C9C
9C9C9C
9C9C9C

Tetradic

9C9C9C
9C9C9C
9C9C9C
9C9C9C

Contrast Matrix WCAG 2.1 Contrast

9C9C9C
FFE5F5
BEAEAF
A8989B
857278
—
2.3
Fail
1.3
Fail
1.0
Fail
1.6
Fail
2.3
Fail
—
1.8
Fail
2.3
Fail
3.8
AA Large
1.3
Fail
1.8
Fail
—
1.3
Fail
2.1
Fail
1.0
Fail
2.3
Fail
1.3
Fail
—
1.6
Fail
1.6
Fail
3.8
AA Large
2.1
Fail
1.6
Fail
—
White BG
2.7Fail
1.2Fail
2.1Fail
2.8Fail
4.5AA Large
Black BG
7.6AAA
17.8AAA
9.9AAA
7.6AAA
4.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9C9C9C
F4F4F1
B7B7AF
A1A19A
7D7D77

Deuteranopia

9C9C9C
F5F7F0
B8B9AF
A2A39A
7E7F76

Tritanopia

9C9C9C
FEEEED
BDAFAF
A79A9A
847575

Achromatopsia

9C9C9C
EFEFEF
B3B3B3
9D9D9D
787878

Shades & Tints Shades & Tints

#9C9C9C

Dark
Light

#FFE5F5

Dark
Light

#BEAEAF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9c9c9c;
  --color-2: #ffe5f5;
  --color-3: #beaeaf;
  --color-4: #a8989b;
  --color-5: #857278;
}

SCSS

$color-1: #9c9c9c;
$color-2: #ffe5f5;
$color-3: #beaeaf;
$color-4: #a8989b;
$color-5: #857278;

TAILWIND

colors: {
  'brand-1': '#9c9c9c',
  'brand-2': '#ffe5f5',
  'brand-3': '#beaeaf',
  'brand-4': '#a8989b',
  'brand-5': '#857278',
}

RGB Array

[156, 156, 156], [255, 229, 245], [190, 174, 175], [168, 152, 155], [133, 114, 120]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9C9C9C, #FFE5F5, #BEAEAF, #A8989B, #857278 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: #9c9c9c; --color-2: #ffe5f5; --color-3: #beaeaf; --color-4: #a8989b; --color-5: #857278. 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