← Back to Editor

#8500FF · #3C1C5A · #030203 · #555555 · #888888

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 LibraryData Visualization

Color Details Color Details

#8500FF

Royal Purple · DarkViolet · Violet

HEX
#8500FF
RGB
rgb(133, 0, 255)
HSL
hsl(271, 100%, 50%)
HSB
hsb(271, 100%, 100%)
CMYK
cmyk(48%, 100%, 0%, 0%)
Oklch
oklch(53.6% 0.293 295.6)

Traditional「Royal Purple」· Paint「Violet」· Creative Blush Sunrise

#3C1C5A

Royal Purple · MidnightBlue · Eggplant

HEX
#3C1C5A
RGB
rgb(60, 28, 90)
HSL
hsl(271, 53%, 23%)
HSB
hsb(271, 69%, 35%)
CMYK
cmyk(33%, 69%, 0%, 65%)
Oklch
oklch(30.6% 0.108 304.5)

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

#030203

Rose Purple · Black · Dark Purple

HEX
#030203
RGB
rgb(3, 2, 3)
HSL
hsl(300, 20%, 1%)
HSB
hsb(300, 33%, 1%)
CMYK
cmyk(0%, 33%, 0%, 99%)
Oklch
oklch(8.9% 0.007 326.1)

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

#555555

Ink Gray · DimGray · Charcoal

HEX
#555555
RGB
rgb(85, 85, 85)
HSL
hsl(0, 0%, 33%)
HSB
hsb(0, 0%, 33%)
CMYK
cmyk(0%, 0%, 0%, 67%)
Oklch
oklch(45.0% 0.000 89.9)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#888888

Ash · Gray · Warm Gray

HEX
#888888
RGB
rgb(136, 136, 136)
HSL
hsl(0, 0%, 53%)
HSB
hsb(0, 0%, 53%)
CMYK
cmyk(0%, 0%, 0%, 47%)
Oklch
oklch(62.7% 0.000 89.9)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8500FF
7BFF00

Analogous

0400FF
8500FF
FF00FB

Triadic

8500FF
FF8400
00FF84

Split-Comp.

8500FF
FBFF00
00FF04

Tetradic

8500FF
FF0400
7BFF00
00FBFF

Contrast Matrix WCAG 2.1 Contrast

8500FF
3C1C5A
030203
555555
888888
—
2.3
Fail
3.4
AA Large
1.2
Fail
1.7
Fail
2.3
Fail
—
1.5
Fail
1.9
Fail
3.9
AA Large
3.4
AA Large
1.5
Fail
—
2.8
Fail
5.8
AA
1.2
Fail
1.9
Fail
2.8
Fail
—
2.1
Fail
1.7
Fail
3.9
AA Large
5.8
AA
2.1
Fail
—
White BG
6.1AA
13.9AAA
20.7AAA
7.5AAA
3.5AA Large
Black BG
3.4AA Large
1.5Fail
1.0Fail
2.8Fail
5.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4B4AC1
2E2E4B
030303
555555
888888

Deuteranopia

535DB3
303247
030303
555555
888888

Tritanopia

7E9186
3A3F3D
030303
555555
888888

Achromatopsia

454545
2D2D2D
020202
555555
888888

Shades & Tints Shades & Tints

#8500FF

Dark
Light

#3C1C5A

Dark
Light

#030203

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8500ff;
  --color-2: #3c1c5a;
  --color-3: #030203;
  --color-4: #555555;
  --color-5: #888888;
}

SCSS

$color-1: #8500ff;
$color-2: #3c1c5a;
$color-3: #030203;
$color-4: #555555;
$color-5: #888888;

TAILWIND

colors: {
  'brand-1': '#8500ff',
  'brand-2': '#3c1c5a',
  'brand-3': '#030203',
  'brand-4': '#555555',
  'brand-5': '#888888',
}

RGB Array

[133, 0, 255], [60, 28, 90], [3, 2, 3], [85, 85, 85], [136, 136, 136]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8500FF, #3C1C5A, #030203, #555555, #888888 is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #8500ff; --color-2: #3c1c5a; --color-3: #030203; --color-4: #555555; --color-5: #888888. 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 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