← Back to Editor

#341F3D · #8A779E · #664175 · #422F4B · #A88CC2

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumCool

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporateData Visualization

Color Details Color Details

#341F3D

Dark Plum · DarkSlateGray · Dark Purple

HEX
#341F3D
RGB
rgb(52, 31, 61)
HSL
hsl(282, 33%, 18%)
HSB
hsb(282, 49%, 24%)
CMYK
cmyk(15%, 49%, 0%, 76%)
Oklch
oklch(28.0% 0.060 315.2)

TraditionalDark Plum」· PaintDark Purple」· Creative Blush Sunrise

#8A779E

Deep Indigo · LightSlateGray · Violet

HEX
#8A779E
RGB
rgb(138, 119, 158)
HSL
hsl(269, 17%, 54%)
HSB
hsb(269, 25%, 62%)
CMYK
cmyk(13%, 25%, 0%, 38%)
Oklch
oklch(60.1% 0.062 306.7)

TraditionalDeep Indigo」· PaintViolet」· Creative Blush Sunrise

#664175

Dark Plum · DarkSlateBlue · Eggplant

HEX
#664175
RGB
rgb(102, 65, 117)
HSL
hsl(283, 29%, 36%)
HSB
hsb(283, 44%, 46%)
CMYK
cmyk(13%, 44%, 0%, 54%)
Oklch
oklch(44.0% 0.093 315.7)

TraditionalDark Plum」· PaintEggplant」· Creative Blush Sunrise

#422F4B

Dark Plum · DarkSlateGray · Eggplant

HEX
#422F4B
RGB
rgb(66, 47, 75)
HSL
hsl(281, 23%, 24%)
HSB
hsb(281, 37%, 29%)
CMYK
cmyk(12%, 37%, 0%, 71%)
Oklch
oklch(33.9% 0.054 314.5)

TraditionalDark Plum」· PaintEggplant」· Creative Blush Sunrise

#A88CC2

Lilac · DarkGray · Lilac Purple

HEX
#A88CC2
RGB
rgb(168, 140, 194)
HSL
hsl(271, 31%, 65%)
HSB
hsb(271, 28%, 76%)
CMYK
cmyk(13%, 28%, 0%, 24%)
Oklch
oklch(68.5% 0.084 307.9)

TraditionalLilac」· PaintLilac Purple」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

341F3D
283D1F

Analogous

251F3D
341F3D
3D1F37

Triadic

341F3D
3D341F
1F3D34

Split-Comp.

341F3D
373D1F
1F3D25

Tetradic

341F3D
3D251F
283D1F
1F373D

Contrast Matrix WCAG 2.1 Contrast

341F3D
8A779E
664175
422F4B
A88CC2
3.7
AA Large
1.8
Fail
1.2
Fail
5.1
AA
3.7
AA Large
2.0
Fail
3.0
Fail
1.4
Fail
1.8
Fail
2.0
Fail
1.5
Fail
2.8
Fail
1.2
Fail
3.0
Fail
1.5
Fail
4.1
AA Large
5.1
AA
1.4
Fail
2.8
Fail
4.1
AA Large
White BG
14.9AAA
4.0AA Large
8.1AAA
12.1AAA
2.9Fail
Black BG
1.4Fail
5.2AA
2.6Fail
1.7Fail
7.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2B2B36
828295
565668
3A3A44
9C9CB5

Deuteranopia

2C2E34
838492
585B65
3B3C43
9EA0B2

Tritanopia

33302F
898D8B
645E5C
413F3E
A7ABA8

Achromatopsia

292929
818181
525252
383838
9B9B9B

Shades & Tints Shades & Tints

#341F3D

Dark
Light

#8A779E

Dark
Light

#664175

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #341f3d;
  --color-2: #8a779e;
  --color-3: #664175;
  --color-4: #422f4b;
  --color-5: #a88cc2;
}

SCSS

$color-1: #341f3d;
$color-2: #8a779e;
$color-3: #664175;
$color-4: #422f4b;
$color-5: #a88cc2;

TAILWIND

colors: {
  'brand-1': '#341f3d',
  'brand-2': '#8a779e',
  'brand-3': '#664175',
  'brand-4': '#422f4b',
  'brand-5': '#a88cc2',
}

RGB Array

[52, 31, 61], [138, 119, 158], [102, 65, 117], [66, 47, 75], [168, 140, 194]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #341F3D, #8A779E, #664175, #422F4B, #A88CC2 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #341f3d; --color-2: #8a779e; --color-3: #664175; --color-4: #422f4b; --color-5: #a88cc2. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 finance, legal, luxury industries. Restrained colors convey professionalism and trust. 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