#5C4B4B + #4B4173 + #5028ED + #887ABF + #656273 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#5C4B4B

Crimson · DarkOliveGreen · Wine Red

HEX

#5C4B4B

RGB

rgb(92, 75, 75)

HSL

hsl(0, 10%, 33%)

HSB

hsb(0, 18%, 36%)

CMYK

cmyk(0%, 18%, 18%, 64%)

Oklch

oklch(43.0% 0.023 18.1)

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

#4B4173

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX

#4B4173

RGB

rgb(75, 65, 115)

HSL

hsl(252, 28%, 35%)

HSB

hsb(252, 43%, 45%)

CMYK

cmyk(35%, 43%, 0%, 55%)

Oklch

oklch(40.9% 0.082 291.5)

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

#5028ED

Deep Indigo · SlateBlue · Navy Blue

HEX

#5028ED

RGB

rgb(80, 40, 237)

HSL

hsl(252, 85%, 54%)

HSB

hsb(252, 83%, 93%)

CMYK

cmyk(66%, 83%, 0%, 7%)

Oklch

oklch(48.4% 0.264 279.2)

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

#887ABF

Wisteria · LightSlateGray · Cobalt Blue

HEX

#887ABF

RGB

rgb(136, 122, 191)

HSL

hsl(252, 35%, 61%)

HSB

hsb(252, 36%, 75%)

CMYK

cmyk(29%, 36%, 0%, 25%)

Oklch

oklch(62.0% 0.103 292.4)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#656273

Deep Indigo · DimGray · Warm Gray

HEX

#656273

RGB

rgb(101, 98, 115)

HSL

hsl(251, 8%, 42%)

HSB

hsb(251, 15%, 45%)

CMYK

cmyk(12%, 15%, 0%, 55%)

Oklch

oklch(50.5% 0.027 293.5)

Traditional「Deep Indigo」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5C4B4B

4C5D5D

Analogous

5D4C54

5C4B4B

5D544C

Triadic

5C4B4B

4C5D4C

4C4C5D

Split-Comp.

5C4B4B

4C5D54

4C545D

Tetradic

5C4B4B

545D4C

4C5D5D

544C5D

Contrast Matrix WCAG 2.1 Contrast

5C4B4B	4B4173	5028ED	887ABF	656273
—	1.1 Fail	1.1 Fail	2.2 Fail	1.4 Fail
1.1 Fail	—	1.2 Fail	2.4 Fail	1.5 Fail
1.1 Fail	1.2 Fail	—	1.9 Fail	1.2 Fail
2.2 Fail	2.4 Fail	1.9 Fail	—	1.6 Fail
1.4 Fail	1.5 Fail	1.2 Fail	1.6 Fail	—

White BG

8.2AAA

9.1AAA

7.3AAA

3.8AA Large

5.9AA

Black BG

2.6Fail

2.3Fail

2.9Fail

5.6AA

3.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

55544B

474767

3F3EBD

8282AE

64646F

Deuteranopia

56574B

474864

4144B2

8384AA

64646E

Tritanopia

5B4B4B

4B5D5B

4E988F

87A19E

656C6B

Achromatopsia

505050

4A4A4A

868686

656565

Shades & Tints Shades & Tints

#5C4B4B

Dark

Light

#4B4173

Dark

Light

#5028ED

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5c4b4b;
  --color-2: #4b4173;
  --color-3: #5028ed;
  --color-4: #887abf;
  --color-5: #656273;
}

SCSS

$color-1: #5c4b4b;
$color-2: #4b4173;
$color-3: #5028ed;
$color-4: #887abf;
$color-5: #656273;

TAILWIND

colors: {
  'brand-1': '#5c4b4b',
  'brand-2': '#4b4173',
  'brand-3': '#5028ed',
  'brand-4': '#887abf',
  'brand-5': '#656273',
}

RGB Array

[92, 75, 75], [75, 65, 115], [80, 40, 237], [136, 122, 191], [101, 98, 115]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5C4B4B, #4B4173, #5028ED, #887ABF, #656273 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: #5c4b4b; --color-2: #4b4173; --color-3: #5028ed; --color-4: #887abf; --color-5: #656273. 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