← Back to Editor

#000030 · #480048 · #780048 · #A80048 · #D87860

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#000030

Deep Indigo · Black · Deep Sea Blue

HEX
#000030
RGB
rgb(0, 0, 48)
HSL
hsl(240, 100%, 9%)
HSB
hsb(240, 100%, 19%)
CMYK
cmyk(100%, 100%, 0%, 81%)
Oklch
oklch(14.0% 0.097 264.1)

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

#480048

Rose Purple · MidnightBlue · Dark Purple

HEX
#480048
RGB
rgb(72, 0, 72)
HSL
hsl(300, 100%, 14%)
HSB
hsb(300, 100%, 28%)
CMYK
cmyk(0%, 100%, 0%, 72%)
Oklch
oklch(28.2% 0.130 328.4)

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

#780048

Rose Purple · Purple · Raspberry

HEX
#780048
RGB
rgb(120, 0, 72)
HSL
hsl(324, 100%, 24%)
HSB
hsb(324, 100%, 47%)
CMYK
cmyk(0%, 100%, 40%, 53%)
Oklch
oklch(37.5% 0.155 353.0)

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

#A80048

Dark Violet · Brown · Camellia

HEX
#A80048
RGB
rgb(168, 0, 72)
HSL
hsl(334, 100%, 33%)
HSB
hsb(334, 100%, 66%)
CMYK
cmyk(0%, 100%, 57%, 34%)
Oklch
oklch(46.9% 0.188 7.1)

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

#D87860

Peach Pink · Salmon · Coral Red

HEX
#D87860
RGB
rgb(216, 120, 96)
HSL
hsl(12, 61%, 61%)
HSB
hsb(12, 56%, 85%)
CMYK
cmyk(0%, 44%, 56%, 15%)
Oklch
oklch(67.4% 0.125 35.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

000030
2E2E00

Analogous

00172E
000030
17002E

Triadic

000030
2E0000
002E00

Split-Comp.

000030
2E1700
172E00

Tetradic

000030
2E0017
2E2E00
002E17

Contrast Matrix WCAG 2.1 Contrast

000030
480048
780048
A80048
D87860
—
1.3
Fail
1.8
Fail
2.6
Fail
6.5
AA
1.3
Fail
—
1.4
Fail
2.0
Fail
4.9
AA
1.8
Fail
1.4
Fail
—
1.5
Fail
3.6
AA Large
2.6
Fail
2.0
Fail
1.5
Fail
—
2.5
Fail
6.5
AA
4.9
AA
3.6
AA Large
2.5
Fail
—
White BG
20.1AAA
15.3AAA
11.1AAA
7.6AAA
3.1AA Large
Black BG
1.0Fail
1.4Fail
1.9Fail
2.8Fail
6.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

000024
292837
444337
5F5E37
AEAE66

Deuteranopia

000022
2D3232
4B5432
697632
B4BB67

Tritanopia

001B19
442926
722926
A02926
D36A6B

Achromatopsia

050505
1E1E1E
2C2C2C
3A3A3A
929292

Shades & Tints Shades & Tints

#000030

Dark
Light

#480048

Dark
Light

#780048

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #000030;
  --color-2: #480048;
  --color-3: #780048;
  --color-4: #a80048;
  --color-5: #d87860;
}

SCSS

$color-1: #000030;
$color-2: #480048;
$color-3: #780048;
$color-4: #a80048;
$color-5: #d87860;

TAILWIND

colors: {
  'brand-1': '#000030',
  'brand-2': '#480048',
  'brand-3': '#780048',
  'brand-4': '#a80048',
  'brand-5': '#d87860',
}

RGB Array

[0, 0, 48], [72, 0, 72], [120, 0, 72], [168, 0, 72], [216, 120, 96]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #000030, #480048, #780048, #A80048, #D87860 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #000030; --color-2: #480048; --color-3: #780048; --color-4: #a80048; --color-5: #d87860. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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