#6D6AA3 + #654B81 + #5F3467 + #522447 + #420727 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#6D6AA3

Deep Indigo · SlateGray · Navy Blue

HEX

#6D6AA3

RGB

rgb(109, 106, 163)

HSL

hsl(243, 24%, 53%)

HSB

hsb(243, 35%, 64%)

CMYK

cmyk(33%, 35%, 0%, 36%)

Oklch

oklch(55.1% 0.088 285.5)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#654B81

Deep Indigo · DarkSlateBlue · Eggplant

HEX

#654B81

RGB

rgb(101, 75, 129)

HSL

hsl(269, 26%, 40%)

HSB

hsb(269, 42%, 51%)

CMYK

cmyk(22%, 42%, 0%, 49%)

Oklch

oklch(46.3% 0.090 305.3)

Traditional「Deep Indigo」· Paint「Eggplant」· Creative Blush Sunrise

#5F3467

Dark Plum · DarkSlateBlue · Eggplant

HEX

#5F3467

RGB

rgb(95, 52, 103)

HSL

hsl(291, 33%, 30%)

HSB

hsb(291, 50%, 40%)

CMYK

cmyk(8%, 50%, 0%, 60%)

Oklch

oklch(40.0% 0.097 321.2)

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

#522447

Rose Purple · DarkSlateGray · Eggplant

HEX

#522447

RGB

rgb(82, 36, 71)

HSL

hsl(314, 39%, 23%)

HSB

hsb(314, 56%, 32%)

CMYK

cmyk(0%, 56%, 13%, 68%)

Oklch

oklch(33.8% 0.084 337.2)

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

#420727

Rose Purple · Maroon · Raspberry

HEX

#420727

RGB

rgb(66, 7, 39)

HSL

hsl(327, 81%, 14%)

HSB

hsb(327, 89%, 26%)

CMYK

cmyk(0%, 89%, 41%, 74%)

Oklch

oklch(25.7% 0.094 353.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6D6AA3

A1A46A

Analogous

6A84A4

6D6AA3

8A6AA4

Triadic

6D6AA3

A46D6A

6AA46D

Split-Comp.

6D6AA3

A48A6A

84A46A

Tetradic

6D6AA3

A46A84

A1A46A

6AA48A

Contrast Matrix WCAG 2.1 Contrast

6D6AA3	654B81	5F3467	522447	420727
—	1.5 Fail	2.0 Fail	2.5 Fail	3.3 AA Large
1.5 Fail	—	1.3 Fail	1.7 Fail	2.2 Fail
2.0 Fail	1.3 Fail	—	1.3 Fail	1.7 Fail
2.5 Fail	1.7 Fail	1.3 Fail	—	1.3 Fail
3.3 AA Large	2.2 Fail	1.7 Fail	1.3 Fail	—

White BG

5.0AA

7.3AAA

9.7AAA

12.3AAA

16.3AAA

Black BG

4.2AA Large

2.9Fail

2.2Fail

1.7Fail

1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

6C6C95

5A5A74

4C4C5B

3E3E3F

28281F

Deuteranopia

6C6C92

5B5D71

4F5258

41443C

2C301D

Tritanopia

6D8A88

646A67

5D514F

503836

3F1918

Achromatopsia

717171

595959

474747

363636

1C1C1C

Shades & Tints Shades & Tints

#6D6AA3

Dark

Light

#654B81

Dark

Light

#5F3467

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6d6aa3;
  --color-2: #654b81;
  --color-3: #5f3467;
  --color-4: #522447;
  --color-5: #420727;
}

SCSS

$color-1: #6d6aa3;
$color-2: #654b81;
$color-3: #5f3467;
$color-4: #522447;
$color-5: #420727;

TAILWIND

colors: {
  'brand-1': '#6d6aa3',
  'brand-2': '#654b81',
  'brand-3': '#5f3467',
  'brand-4': '#522447',
  'brand-5': '#420727',
}

RGB Array

[109, 106, 163], [101, 75, 129], [95, 52, 103], [82, 36, 71], [66, 7, 39]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6D6AA3, #654B81, #5F3467, #522447, #420727 is ideal for: tech websites, dark mode UIs, game UIs. 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: #6d6aa3; --color-2: #654b81; --color-3: #5f3467; --color-4: #522447; --color-5: #420727. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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