← Back to Editor

#7F7D88 · #968797 · #E28DAF · #E0A2C3 · #B2CDD5

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7F7D88

Ash · Gray · Warm Gray

HEX
#7F7D88
RGB
rgb(127, 125, 136)
HSL
hsl(251, 4%, 51%)
HSB
hsb(251, 8%, 53%)
CMYK
cmyk(7%, 8%, 0%, 47%)
Oklch
oklch(59.5% 0.017 294.2)

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

#968797

Ash · LightSlateGray · Silver Sand

HEX
#968797
RGB
rgb(150, 135, 151)
HSL
hsl(296, 7%, 56%)
HSB
hsb(296, 11%, 59%)
CMYK
cmyk(1%, 11%, 0%, 41%)
Oklch
oklch(64.2% 0.029 324.0)

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

#E28DAF

Rouge · Orchid · Rose Pink

HEX
#E28DAF
RGB
rgb(226, 141, 175)
HSL
hsl(336, 59%, 72%)
HSB
hsb(336, 38%, 89%)
CMYK
cmyk(0%, 38%, 23%, 11%)
Oklch
oklch(74.1% 0.111 354.6)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#E0A2C3

Mauve · LightPink · Cherry Blossom

HEX
#E0A2C3
RGB
rgb(224, 162, 195)
HSL
hsl(328, 50%, 76%)
HSB
hsb(328, 28%, 88%)
CMYK
cmyk(0%, 28%, 13%, 12%)
Oklch
oklch(78.1% 0.085 346.0)

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

#B2CDD5

Sky Blue · LightSteelBlue · Glacier Blue

HEX
#B2CDD5
RGB
rgb(178, 205, 213)
HSL
hsl(194, 29%, 77%)
HSB
hsb(194, 16%, 84%)
CMYK
cmyk(16%, 4%, 0%, 16%)
Oklch
oklch(83.1% 0.031 217.5)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7F7D88
85877D

Analogous

7D8087
7F7D88
847D87

Triadic

7F7D88
877F7D
7D877F

Split-Comp.

7F7D88
87847D
80877D

Tetradic

7F7D88
877D80
85877D
7D8784

Contrast Matrix WCAG 2.1 Contrast

7F7D88
968797
E28DAF
E0A2C3
B2CDD5
—
1.2
Fail
1.7
Fail
2.0
Fail
2.4
Fail
1.2
Fail
—
1.4
Fail
1.6
Fail
2.0
Fail
1.7
Fail
1.4
Fail
—
1.2
Fail
1.5
Fail
2.0
Fail
1.6
Fail
1.2
Fail
—
1.2
Fail
2.4
Fail
2.0
Fail
1.5
Fail
1.2
Fail
—
White BG
4.0AA Large
3.4AA Large
2.4Fail
2.1Fail
1.7Fail
Black BG
5.2AA
6.2AA
8.7AAA
10.1AAA
12.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7E7E85
908F93
BDBCA7
C5C5BB
BEBED3

Deuteranopia

7E7E85
909292
C2C9A5
C9CDB9
BCBAD3

Tritanopia

7F8383
95908F
DEA09F
DDB5B3
B3D2D1

Achromatopsia

7F7F7F
8D8D8D
AAAAAA
B8B8B8
C6C6C6

Shades & Tints Shades & Tints

#7F7D88

Dark
Light

#968797

Dark
Light

#E28DAF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7f7d88;
  --color-2: #968797;
  --color-3: #e28daf;
  --color-4: #e0a2c3;
  --color-5: #b2cdd5;
}

SCSS

$color-1: #7f7d88;
$color-2: #968797;
$color-3: #e28daf;
$color-4: #e0a2c3;
$color-5: #b2cdd5;

TAILWIND

colors: {
  'brand-1': '#7f7d88',
  'brand-2': '#968797',
  'brand-3': '#e28daf',
  'brand-4': '#e0a2c3',
  'brand-5': '#b2cdd5',
}

RGB Array

[127, 125, 136], [150, 135, 151], [226, 141, 175], [224, 162, 195], [178, 205, 213]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7F7D88, #968797, #E28DAF, #E0A2C3, #B2CDD5 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. 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: #7f7d88; --color-2: #968797; --color-3: #e28daf; --color-4: #e0a2c3; --color-5: #b2cdd5. 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. 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