← Back to Editor

#DE9BDC · #C785C5 · #A667A4 · #915A90 · #C2A5C1

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

#DE9BDC

Mauve · Violet · Lilac Purple

HEX
#DE9BDC
RGB
rgb(222, 155, 220)
HSL
hsl(302, 50%, 74%)
HSB
hsb(302, 30%, 87%)
CMYK
cmyk(0%, 30%, 1%, 13%)
Oklch
oklch(77.5% 0.116 327.6)

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

#C785C5

Mauve · Orchid · Lilac Purple

HEX
#C785C5
RGB
rgb(199, 133, 197)
HSL
hsl(302, 37%, 65%)
HSB
hsb(302, 33%, 78%)
CMYK
cmyk(0%, 33%, 1%, 22%)
Oklch
oklch(70.5% 0.117 327.8)

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

#A667A4

Rose Purple · MediumOrchid · Violet

HEX
#A667A4
RGB
rgb(166, 103, 164)
HSL
hsl(302, 26%, 53%)
HSB
hsb(302, 38%, 65%)
CMYK
cmyk(0%, 38%, 1%, 35%)
Oklch
oklch(60.4% 0.115 328.0)

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

#915A90

Rose Purple · Gray · Violet

HEX
#915A90
RGB
rgb(145, 90, 144)
HSL
hsl(301, 23%, 46%)
HSB
hsb(301, 38%, 57%)
CMYK
cmyk(0%, 38%, 1%, 43%)
Oklch
oklch(54.8% 0.104 327.5)

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

#C2A5C1

Mauve · Silver · Lilac Purple

HEX
#C2A5C1
RGB
rgb(194, 165, 193)
HSL
hsl(302, 19%, 70%)
HSB
hsb(302, 15%, 76%)
CMYK
cmyk(0%, 15%, 1%, 24%)
Oklch
oklch(75.6% 0.051 327.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DE9BDC
9CDE9E

Analogous

BF9CDE
DE9BDC
DE9CBA

Triadic

DE9BDC
DCDE9C
9CDCDE

Split-Comp.

DE9BDC
BADE9C
9CDEBF

Tetradic

DE9BDC
DEBF9C
9CDE9E
9CBADE

Contrast Matrix WCAG 2.1 Contrast

DE9BDC
C785C5
A667A4
915A90
C2A5C1
—
1.3
Fail
1.9
Fail
2.4
Fail
1.0
Fail
1.3
Fail
—
1.5
Fail
1.9
Fail
1.2
Fail
1.9
Fail
1.5
Fail
—
1.3
Fail
1.9
Fail
2.4
Fail
1.9
Fail
1.3
Fail
—
2.3
Fail
1.0
Fail
1.2
Fail
1.9
Fail
2.3
Fail
—
White BG
2.1Fail
2.8Fail
4.1AA Large
5.2AA
2.2Fail
Black BG
9.8AAA
7.6AAA
5.1AA
4.1AA Large
9.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C1C0CC
AAAAB6
8B8A95
797983
B5B5BA

Deuteranopia

C5CAC9
AEB3B2
8E9392
7C8180
B7B9B9

Tritanopia

DBC0BD
C4A9A7
A38A87
8E7976
C1B5B4

Achromatopsia

B6B6B6
A0A0A0
818181
717171
B1B1B1

Shades & Tints Shades & Tints

#DE9BDC

Dark
Light

#C785C5

Dark
Light

#A667A4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #de9bdc;
  --color-2: #c785c5;
  --color-3: #a667a4;
  --color-4: #915a90;
  --color-5: #c2a5c1;
}

SCSS

$color-1: #de9bdc;
$color-2: #c785c5;
$color-3: #a667a4;
$color-4: #915a90;
$color-5: #c2a5c1;

TAILWIND

colors: {
  'brand-1': '#de9bdc',
  'brand-2': '#c785c5',
  'brand-3': '#a667a4',
  'brand-4': '#915a90',
  'brand-5': '#c2a5c1',
}

RGB Array

[222, 155, 220], [199, 133, 197], [166, 103, 164], [145, 90, 144], [194, 165, 193]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DE9BDC, #C785C5, #A667A4, #915A90, #C2A5C1 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: #de9bdc; --color-2: #c785c5; --color-3: #a667a4; --color-4: #915a90; --color-5: #c2a5c1. 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. 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