← Back to Editor

#65337D · #83376A · #A13A57 · #BE3E45 · #DC4132

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#65337D

Dark Plum · DarkSlateBlue · Eggplant

HEX
#65337D
RGB
rgb(101, 51, 125)
HSL
hsl(281, 42%, 35%)
HSB
hsb(281, 59%, 49%)
CMYK
cmyk(19%, 59%, 0%, 51%)
Oklch
oklch(42.0% 0.127 313.4)

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

#83376A

Rose Purple · DimGray · Camellia

HEX
#83376A
RGB
rgb(131, 55, 106)
HSL
hsl(320, 41%, 36%)
HSB
hsb(320, 58%, 51%)
CMYK
cmyk(0%, 58%, 19%, 49%)
Oklch
oklch(45.7% 0.122 342.1)

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

#A13A57

Dark Violet · Brown · Camellia

HEX
#A13A57
RGB
rgb(161, 58, 87)
HSL
hsl(343, 47%, 43%)
HSB
hsb(343, 64%, 63%)
CMYK
cmyk(0%, 64%, 46%, 37%)
Oklch
oklch(50.1% 0.138 6.3)

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

#BE3E45

Crimson · Brown · Passion Red

HEX
#BE3E45
RGB
rgb(190, 62, 69)
HSL
hsl(357, 51%, 49%)
HSB
hsb(357, 67%, 75%)
CMYK
cmyk(0%, 67%, 64%, 25%)
Oklch
oklch(54.9% 0.164 21.3)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#DC4132

Vermilion · Chocolate · Passion Red

HEX
#DC4132
RGB
rgb(220, 65, 50)
HSL
hsl(5, 71%, 53%)
HSB
hsb(5, 77%, 86%)
CMYK
cmyk(0%, 70%, 77%, 14%)
Oklch
oklch(60.0% 0.194 29.5)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

65337D
4C7F34

Analogous

42347F
65337D
7F3471

Triadic

65337D
7F6734
347F67

Split-Comp.

65337D
717F34
347F42

Tetradic

65337D
7F4234
4C7F34
34717F

Contrast Matrix WCAG 2.1 Contrast

65337D
83376A
A13A57
BE3E45
DC4132
—
1.2
Fail
1.4
Fail
1.7
Fail
2.1
Fail
1.2
Fail
—
1.2
Fail
1.5
Fail
1.8
Fail
1.4
Fail
1.2
Fail
—
1.2
Fail
1.5
Fail
1.7
Fail
1.5
Fail
1.2
Fail
—
1.2
Fail
2.1
Fail
1.8
Fail
1.5
Fail
1.2
Fail
—
White BG
9.0AAA
7.7AAA
6.4AA
5.3AA
4.3AA Large
Black BG
2.3Fail
2.7Fail
3.3AA Large
4.0AA Large
4.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4F4F6B
62615E
747350
878543
999736

Deuteranopia

525667
676C5B
7A824E
8E9843
A2AE37

Tritanopia

625D5A
7F5452
9C4A49
B84242
D43839

Achromatopsia

4A4A4A
545454
5C5C5C
656565
6E6E6E

Shades & Tints Shades & Tints

#65337D

Dark
Light

#83376A

Dark
Light

#A13A57

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #65337d;
  --color-2: #83376a;
  --color-3: #a13a57;
  --color-4: #be3e45;
  --color-5: #dc4132;
}

SCSS

$color-1: #65337d;
$color-2: #83376a;
$color-3: #a13a57;
$color-4: #be3e45;
$color-5: #dc4132;

TAILWIND

colors: {
  'brand-1': '#65337d',
  'brand-2': '#83376a',
  'brand-3': '#a13a57',
  'brand-4': '#be3e45',
  'brand-5': '#dc4132',
}

RGB Array

[101, 51, 125], [131, 55, 106], [161, 58, 87], [190, 62, 69], [220, 65, 50]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #65337D, #83376A, #A13A57, #BE3E45, #DC4132 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: #65337d; --color-2: #83376a; --color-3: #a13a57; --color-4: #be3e45; --color-5: #dc4132. 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