#DB1D70 + #BC4683 + #9C6F97 + #7D97AA + #5DC0BD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#DB1D70

Dark Violet · MediumVioletRed · Camellia

HEX

#DB1D70

RGB

rgb(219, 29, 112)

HSL

hsl(334, 77%, 49%)

HSB

hsb(334, 87%, 86%)

CMYK

cmyk(0%, 87%, 49%, 14%)

Oklch

oklch(58.4% 0.222 2.5)

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

#BC4683

Rose Purple · MediumVioletRed · Rose Pink

HEX

#BC4683

RGB

rgb(188, 70, 131)

HSL

hsl(329, 47%, 51%)

HSB

hsb(329, 63%, 74%)

CMYK

cmyk(0%, 63%, 30%, 26%)

Oklch

oklch(57.2% 0.164 351.5)

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

#9C6F97

Rose Purple · Gray · Violet

HEX

#9C6F97

RGB

rgb(156, 111, 151)

HSL

hsl(307, 19%, 52%)

HSB

hsb(307, 29%, 61%)

CMYK

cmyk(0%, 29%, 3%, 39%)

Oklch

oklch(60.1% 0.080 330.4)

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

#7D97AA

Slate Blue · LightSlateGray · Navy Blue

HEX

#7D97AA

RGB

rgb(125, 151, 170)

HSL

hsl(205, 21%, 58%)

HSB

hsb(205, 26%, 67%)

CMYK

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

Oklch

oklch(66.3% 0.041 239.9)

Traditional「Slate Blue」· Paint「Navy Blue」· Creative Blush Sunrise

#5DC0BD

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#5DC0BD

RGB

rgb(93, 192, 189)

HSL

hsl(178, 44%, 56%)

HSB

hsb(178, 52%, 75%)

CMYK

cmyk(52%, 0%, 2%, 25%)

Oklch

oklch(74.8% 0.093 192.7)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DB1D70

1DDD8A

Analogous

DD1DD0

DB1D70

DD2A1D

Triadic

DB1D70

70DD1D

1D70DD

Split-Comp.

DB1D70

1DDD2A

1DD0DD

Tetradic

DB1D70

D0DD1D

1DDD8A

2A1DDD

Contrast Matrix WCAG 2.1 Contrast

DB1D70	BC4683	9C6F97	7D97AA	5DC0BD
—	1.0 Fail	1.2 Fail	1.6 Fail	2.2 Fail
1.0 Fail	—	1.2 Fail	1.6 Fail	2.2 Fail
1.2 Fail	1.2 Fail	—	1.3 Fail	1.9 Fail
1.6 Fail	1.6 Fail	1.3 Fail	—	1.4 Fail
2.2 Fail	2.2 Fail	1.9 Fail	1.4 Fail	—

White BG

4.7AA

4.8AA

4.1AA Large

3.1AA Large

2.2Fail

Black BG

4.4AA Large

4.3AA Large

5.1AA

6.9AA

9.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

89875C

898874

89888D

8888A5

8889BE

Deuteranopia

94A257

909971

8B8F8B

8785A4

827BBE

Tritanopia

D14C49

B66966

9A8684

7EA2A1

62BEBE

Achromatopsia

5F5F5F

707070

818181

919191

A2A2A2

Shades & Tints Shades & Tints

#DB1D70

Dark

Light

#BC4683

Dark

Light

#9C6F97

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #db1d70;
  --color-2: #bc4683;
  --color-3: #9c6f97;
  --color-4: #7d97aa;
  --color-5: #5dc0bd;
}

SCSS

$color-1: #db1d70;
$color-2: #bc4683;
$color-3: #9c6f97;
$color-4: #7d97aa;
$color-5: #5dc0bd;

TAILWIND

colors: {
  'brand-1': '#db1d70',
  'brand-2': '#bc4683',
  'brand-3': '#9c6f97',
  'brand-4': '#7d97aa',
  'brand-5': '#5dc0bd',
}

RGB Array

[219, 29, 112], [188, 70, 131], [156, 111, 151], [125, 151, 170], [93, 192, 189]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DB1D70, #BC4683, #9C6F97, #7D97AA, #5DC0BD 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: #db1d70; --color-2: #bc4683; --color-3: #9c6f97; --color-4: #7d97aa; --color-5: #5dc0bd. 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