#DD39AC + #D151BA + #C568C7 + #B880D5 + #AC97E2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#DD39AC

Rose Purple · DeepPink · Violet

HEX

#DD39AC

RGB

rgb(221, 57, 172)

HSL

hsl(318, 71%, 55%)

HSB

hsb(318, 74%, 87%)

CMYK

cmyk(0%, 74%, 22%, 13%)

Oklch

oklch(62.7% 0.227 342.8)

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

#D151BA

Rose Purple · MediumOrchid · Violet

HEX

#D151BA

RGB

rgb(209, 81, 186)

HSL

hsl(311, 58%, 57%)

HSB

hsb(311, 61%, 82%)

CMYK

cmyk(0%, 61%, 11%, 18%)

Oklch

oklch(63.9% 0.200 335.4)

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

#C568C7

Dark Plum · MediumOrchid · Violet

HEX

#C568C7

RGB

rgb(197, 104, 199)

HSL

hsl(299, 46%, 59%)

HSB

hsb(299, 48%, 78%)

CMYK

cmyk(1%, 48%, 0%, 22%)

Oklch

oklch(65.8% 0.168 326.5)

Traditional「Dark Plum」· Paint「Violet」· Creative Blush Sunrise

#B880D5

Lilac · Orchid · Lilac Purple

HEX

#B880D5

RGB

rgb(184, 128, 213)

HSL

hsl(280, 50%, 67%)

HSB

hsb(280, 40%, 84%)

CMYK

cmyk(14%, 40%, 0%, 16%)

Oklch

oklch(68.8% 0.135 313.5)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#AC97E2

Wisteria · LightSteelBlue · Cobalt Blue

HEX

#AC97E2

RGB

rgb(172, 151, 226)

HSL

hsl(257, 56%, 74%)

HSB

hsb(257, 33%, 89%)

CMYK

cmyk(24%, 33%, 0%, 11%)

Oklch

oklch(72.3% 0.109 296.4)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DD39AC

3BDE6C

Analogous

BD3BDE

DD39AC

DE3B5B

Triadic

DD39AC

ADDE3B

3BADDE

Split-Comp.

DD39AC

5BDE3B

3BDEBD

Tetradic

DD39AC

DEBD3B

3BDE6C

3B5BDE

Contrast Matrix WCAG 2.1 Contrast

DD39AC	D151BA	C568C7	B880D5	AC97E2
—	1.1 Fail	1.2 Fail	1.3 Fail	1.6 Fail
1.1 Fail	—	1.1 Fail	1.3 Fail	1.5 Fail
1.2 Fail	1.1 Fail	—	1.1 Fail	1.3 Fail
1.3 Fail	1.3 Fail	1.1 Fail	—	1.2 Fail
1.6 Fail	1.5 Fail	1.3 Fail	1.2 Fail	—

White BG

4.0AA Large

3.8AA Large

3.4AA Large

3.0Fail

2.5Fail

Black BG

5.3AA

5.6AA

6.2AA

7.1AAA

8.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

969590

9A98A1

9D9CB0

A09FC0

A3A3D0

Deuteranopia

A0AC8A

A1AB9B

A2A9AA

A3A7BC

A4A6CC

Tritanopia

D57A75

CB8D88

C09E9A

B5B0AD

ABC2BE

Achromatopsia

777777

838383

8F8F8F

9A9A9A

A6A6A6

Shades & Tints Shades & Tints

#DD39AC

Dark

Light

#D151BA

Dark

Light

#C568C7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dd39ac;
  --color-2: #d151ba;
  --color-3: #c568c7;
  --color-4: #b880d5;
  --color-5: #ac97e2;
}

SCSS

$color-1: #dd39ac;
$color-2: #d151ba;
$color-3: #c568c7;
$color-4: #b880d5;
$color-5: #ac97e2;

TAILWIND

colors: {
  'brand-1': '#dd39ac',
  'brand-2': '#d151ba',
  'brand-3': '#c568c7',
  'brand-4': '#b880d5',
  'brand-5': '#ac97e2',
}

RGB Array

[221, 57, 172], [209, 81, 186], [197, 104, 199], [184, 128, 213], [172, 151, 226]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DD39AC, #D151BA, #C568C7, #B880D5, #AC97E2 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: #dd39ac; --color-2: #d151ba; --color-3: #c568c7; --color-4: #b880d5; --color-5: #ac97e2. 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