#D92963 + #D97395 + #B89EB9 + #7781A3 + #2C5166 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D92963

Dark Violet · MediumVioletRed · Rose Pink

HEX

#D92963

RGB

rgb(217, 41, 99)

HSL

hsl(340, 70%, 51%)

HSB

hsb(340, 81%, 85%)

CMYK

cmyk(0%, 81%, 54%, 15%)

Oklch

oklch(58.4% 0.210 8.1)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#D97395

Rouge · LightCoral · Rose Pink

HEX

#D97395

RGB

rgb(217, 115, 149)

HSL

hsl(340, 57%, 65%)

HSB

hsb(340, 47%, 85%)

CMYK

cmyk(0%, 47%, 31%, 15%)

Oklch

oklch(68.0% 0.132 360.0)

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

#B89EB9

Lilac · DarkGray · Lilac Purple

HEX

#B89EB9

RGB

rgb(184, 158, 185)

HSL

hsl(298, 16%, 67%)

HSB

hsb(298, 15%, 73%)

CMYK

cmyk(1%, 15%, 0%, 27%)

Oklch

oklch(73.1% 0.048 324.9)

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

#7781A3

Azure · LightSlateGray · Navy Blue

HEX

#7781A3

RGB

rgb(119, 129, 163)

HSL

hsl(226, 19%, 55%)

HSB

hsb(226, 27%, 64%)

CMYK

cmyk(27%, 21%, 0%, 36%)

Oklch

oklch(60.8% 0.053 272.0)

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

#2C5166

Slate Blue · DarkSlateGray · Prussian Blue

HEX

#2C5166

RGB

rgb(44, 81, 102)

HSL

hsl(202, 40%, 29%)

HSB

hsb(202, 57%, 40%)

CMYK

cmyk(57%, 21%, 0%, 60%)

Oklch

oklch(41.7% 0.055 235.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D92963

2BDA9F

Analogous

DA2BBC

D92963

DA482B

Triadic

D92963

65DA2B

2B65DA

Split-Comp.

D92963

2BDA48

2BBCDA

Tetradic

D92963

BCDA2B

2BDA9F

482BDA

Contrast Matrix WCAG 2.1 Contrast

D92963	D97395	B89EB9	7781A3	2C5166
—	1.5 Fail	1.9 Fail	1.2 Fail	1.8 Fail
1.5 Fail	—	1.3 Fail	1.3 Fail	2.8 Fail
1.9 Fail	1.3 Fail	—	1.6 Fail	3.5 AA Large
1.2 Fail	1.3 Fail	1.6 Fail	—	2.2 Fail
1.8 Fail	2.8 Fail	3.5 AA Large	2.2 Fail	—

White BG

4.7AA

3.1AA Large

2.4Fail

3.9AA Large

8.5AAA

Black BG

4.4AA Large

6.8AA

8.6AAA

5.5AA

2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8D8B55

ADAC8D

ADADB2

7B7B9B

3C3C61

Deuteranopia

97A452

B3BA8B

AEB0B1

7B7A99

3A3760

Tritanopia

D04A47

D48685

B7ADAC

789493

2E5D5C

Achromatopsia

646464

959595

A9A9A9

828282

484848

Shades & Tints Shades & Tints

#D92963

Dark

Light

#D97395

Dark

Light

#B89EB9

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d92963;
  --color-2: #d97395;
  --color-3: #b89eb9;
  --color-4: #7781a3;
  --color-5: #2c5166;
}

SCSS

$color-1: #d92963;
$color-2: #d97395;
$color-3: #b89eb9;
$color-4: #7781a3;
$color-5: #2c5166;

TAILWIND

colors: {
  'brand-1': '#d92963',
  'brand-2': '#d97395',
  'brand-3': '#b89eb9',
  'brand-4': '#7781a3',
  'brand-5': '#2c5166',
}

RGB Array

[217, 41, 99], [217, 115, 149], [184, 158, 185], [119, 129, 163], [44, 81, 102]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D92963, #D97395, #B89EB9, #7781A3, #2C5166 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: #d92963; --color-2: #d97395; --color-3: #b89eb9; --color-4: #7781a3; --color-5: #2c5166. 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