← Back to Editor

#ADB2B5 · #CC7DB4 · #E80CFA · #9E6793 · #8C6F86

space

A 5-color space 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

#ADB2B5

Ash · DarkGray · Silver Sand

HEX
#ADB2B5
RGB
rgb(173, 178, 181)
HSL
hsl(203, 5%, 69%)
HSB
hsb(203, 4%, 71%)
CMYK
cmyk(4%, 2%, 0%, 29%)
Oklch
oklch(76.0% 0.007 233.7)

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

#CC7DB4

Mauve · Orchid · Lilac Purple

HEX
#CC7DB4
RGB
rgb(204, 125, 180)
HSL
hsl(318, 44%, 65%)
HSB
hsb(318, 39%, 80%)
CMYK
cmyk(0%, 39%, 12%, 20%)
Oklch
oklch(69.1% 0.120 339.1)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#E80CFA

Royal Purple · Magenta · Violet

HEX
#E80CFA
RGB
rgb(232, 12, 250)
HSL
hsl(295, 96%, 51%)
HSB
hsb(295, 95%, 98%)
CMYK
cmyk(7%, 95%, 0%, 2%)
Oklch
oklch(66.6% 0.309 324.3)

Traditional「Royal Purple」· Paint「Violet」· Creative Blush Sunrise

#9E6793

Rose Purple · Gray · Violet

HEX
#9E6793
RGB
rgb(158, 103, 147)
HSL
hsl(312, 22%, 51%)
HSB
hsb(312, 35%, 62%)
CMYK
cmyk(0%, 35%, 7%, 38%)
Oklch
oklch(58.7% 0.093 334.2)

Traditional「Rose Purple」· Paint「Violet」· Creative Blush Sunrise

#8C6F86

Rose Purple · Gray · Violet

HEX
#8C6F86
RGB
rgb(140, 111, 134)
HSL
hsl(312, 12%, 49%)
HSB
hsb(312, 21%, 55%)
CMYK
cmyk(0%, 21%, 4%, 45%)
Oklch
oklch(57.8% 0.049 333.5)

Traditional「Rose Purple」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ADB2B5
B4AFAC

Analogous

ACB4B3
ADB2B5
ACADB4

Triadic

ADB2B5
B4ACB1
B1B4AC

Split-Comp.

ADB2B5
B4ACAD
B4B3AC

Tetradic

ADB2B5
B3ACB4
B4AFAC
ADB4AC

Contrast Matrix WCAG 2.1 Contrast

ADB2B5
CC7DB4
E80CFA
9E6793
8C6F86
—
1.4
Fail
1.7
Fail
2.0
Fail
2.1
Fail
1.4
Fail
—
1.2
Fail
1.5
Fail
1.5
Fail
1.7
Fail
1.2
Fail
—
1.2
Fail
1.2
Fail
2.0
Fail
1.5
Fail
1.2
Fail
—
1.0
Fail
2.1
Fail
1.5
Fail
1.2
Fail
1.0
Fail
—
White BG
2.1Fail
2.9Fail
3.6AA Large
4.4AA Large
4.4AA Large
Black BG
9.8AAA
7.2AAA
5.9AA
4.8AA
4.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

AFAFB4
AAA9A7
8987C0
868688
7F7F80

Deuteranopia

AFAFB4
AEB4A4
96A6B3
898E86
81837F

Tritanopia

ADB4B4
C89C9A
DD9389
9B807E
8B7C7B

Achromatopsia

B1B1B1
9B9B9B
696969
7C7C7C
7A7A7A

Shades & Tints Shades & Tints

#ADB2B5

Dark
Light

#CC7DB4

Dark
Light

#E80CFA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #adb2b5;
  --color-2: #cc7db4;
  --color-3: #e80cfa;
  --color-4: #9e6793;
  --color-5: #8c6f86;
}

SCSS

$color-1: #adb2b5;
$color-2: #cc7db4;
$color-3: #e80cfa;
$color-4: #9e6793;
$color-5: #8c6f86;

TAILWIND

colors: {
  'brand-1': '#adb2b5',
  'brand-2': '#cc7db4',
  'brand-3': '#e80cfa',
  'brand-4': '#9e6793',
  'brand-5': '#8c6f86',
}

RGB Array

[173, 178, 181], [204, 125, 180], [232, 12, 250], [158, 103, 147], [140, 111, 134]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #ADB2B5, #CC7DB4, #E80CFA, #9E6793, #8C6F86 is ideal for: corporate websites, product showcases, portfolios. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #adb2b5; --color-2: #cc7db4; --color-3: #e80cfa; --color-4: #9e6793; --color-5: #8c6f86. 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 space-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. 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