#8D0364 + #85357E + #7F5796 + #778AAD + #6FBCCC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#8D0364

Rose Purple · Purple · Eggplant

HEX

#8D0364

RGB

rgb(141, 3, 100)

HSL

hsl(318, 96%, 28%)

HSB

hsb(318, 98%, 55%)

CMYK

cmyk(0%, 98%, 29%, 45%)

Oklch

oklch(42.9% 0.180 345.9)

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

#85357E

Rose Purple · Purple · Eggplant

HEX

#85357E

RGB

rgb(133, 53, 126)

HSL

hsl(305, 43%, 36%)

HSB

hsb(305, 60%, 52%)

CMYK

cmyk(0%, 60%, 5%, 48%)

Oklch

oklch(46.7% 0.143 331.1)

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

#7F5796

Dark Plum · SlateGray · Violet

HEX

#7F5796

RGB

rgb(127, 87, 150)

HSL

hsl(278, 27%, 46%)

HSB

hsb(278, 42%, 59%)

CMYK

cmyk(15%, 42%, 0%, 41%)

Oklch

oklch(52.5% 0.106 312.4)

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

#778AAD

Azure · LightSlateGray · Navy Blue

HEX

#778AAD

RGB

rgb(119, 138, 173)

HSL

hsl(219, 25%, 57%)

HSB

hsb(219, 31%, 68%)

CMYK

cmyk(31%, 20%, 0%, 32%)

Oklch

oklch(63.1% 0.057 262.5)

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

#6FBCCC

Sky Blue · MediumAquaMarine · Lake Green

HEX

#6FBCCC

RGB

rgb(111, 188, 204)

HSL

hsl(190, 48%, 62%)

HSB

hsb(190, 46%, 80%)

CMYK

cmyk(46%, 8%, 0%, 20%)

Oklch

oklch(75.1% 0.079 212.5)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8D0364

038C2C

Analogous

71038C

8D0364

8C031E

Triadic

8D0364

638C03

03638C

Split-Comp.

8D0364

1E8C03

038C71

Tetradic

8D0364

8C7103

038C2C

031E8C

Contrast Matrix WCAG 2.1 Contrast

8D0364	85357E	7F5796	778AAD	6FBCCC
—	1.2 Fail	1.6 Fail	2.6 Fail	4.2 AA Large
1.2 Fail	—	1.3 Fail	2.1 Fail	3.5 AA Large
1.6 Fail	1.3 Fail	—	1.6 Fail	2.6 Fail
2.6 Fail	2.1 Fail	1.6 Fail	—	1.6 Fail
4.2 AA Large	3.5 AA Large	2.6 Fail	1.6 Fail	—

White BG

9.0AAA

7.5AAA

5.7AA

3.5AA Large

2.2Fail

Black BG

2.3Fail

2.8Fail

3.7AA Large

6.0AA

9.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

51504D

62626C

6E6D87

7F7FA5

9091C8

Deuteranopia

596447

676D68

707383

7E7DA3

8C86C7

Tritanopia

863A36

815E5B

7D7B78

789E9C

73C5C4

Achromatopsia

373737

555555

6A6A6A

888888

A7A7A7

Shades & Tints Shades & Tints

#8D0364

Dark

Light

#85357E

Dark

Light

#7F5796

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8d0364;
  --color-2: #85357e;
  --color-3: #7f5796;
  --color-4: #778aad;
  --color-5: #6fbccc;
}

SCSS

$color-1: #8d0364;
$color-2: #85357e;
$color-3: #7f5796;
$color-4: #778aad;
$color-5: #6fbccc;

TAILWIND

colors: {
  'brand-1': '#8d0364',
  'brand-2': '#85357e',
  'brand-3': '#7f5796',
  'brand-4': '#778aad',
  'brand-5': '#6fbccc',
}

RGB Array

[141, 3, 100], [133, 53, 126], [127, 87, 150], [119, 138, 173], [111, 188, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8D0364, #85357E, #7F5796, #778AAD, #6FBCCC 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: #8d0364; --color-2: #85357e; --color-3: #7f5796; --color-4: #778aad; --color-5: #6fbccc. 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