← Back to Editor

#030F15 · #85B20B · #6B066B · #8D0991 · #CF0DE0

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#030F15

Lake Blue · Black · Deep Sea Blue

HEX
#030F15
RGB
rgb(3, 15, 21)
HSL
hsl(200, 75%, 5%)
HSB
hsb(200, 86%, 8%)
CMYK
cmyk(86%, 29%, 0%, 92%)
Oklch
oklch(15.9% 0.023 228.2)

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

#85B20B

Grass Green · Olive · Forest Green

HEX
#85B20B
RGB
rgb(133, 178, 11)
HSL
hsl(76, 88%, 37%)
HSB
hsb(76, 94%, 70%)
CMYK
cmyk(25%, 0%, 94%, 30%)
Oklch
oklch(70.5% 0.177 125.8)

Traditional「Grass Green」· Paint「Forest Green」· Creative Blush Sunrise

#6B066B

Rose Purple · Purple · Eggplant

HEX
#6B066B
RGB
rgb(107, 6, 107)
HSL
hsl(300, 89%, 22%)
HSB
hsb(300, 94%, 42%)
CMYK
cmyk(0%, 94%, 0%, 58%)
Oklch
oklch(37.3% 0.166 328.3)

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

#8D0991

Royal Purple · DarkMagenta · Eggplant

HEX
#8D0991
RGB
rgb(141, 9, 145)
HSL
hsl(298, 88%, 30%)
HSB
hsb(298, 94%, 57%)
CMYK
cmyk(3%, 94%, 0%, 43%)
Oklch
oklch(45.7% 0.206 326.8)

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

#CF0DE0

Royal Purple · Magenta · Violet

HEX
#CF0DE0
RGB
rgb(207, 13, 224)
HSL
hsl(295, 89%, 46%)
HSB
hsb(295, 94%, 88%)
CMYK
cmyk(8%, 94%, 0%, 12%)
Oklch
oklch(61.3% 0.284 324.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

030F15
160A03

Analogous

031613
030F15
030616

Triadic

030F15
160310
101603

Split-Comp.

030F15
160306
161303

Tetradic

030F15
130316
160A03
061603

Contrast Matrix WCAG 2.1 Contrast

030F15
85B20B
6B066B
8D0991
CF0DE0
—
7.7
AAA
1.7
Fail
2.4
Fail
4.4
AA Large
7.7
AAA
—
4.5
AA Large
3.2
AA Large
1.7
Fail
1.7
Fail
4.5
AA Large
—
1.4
Fail
2.6
Fail
2.4
Fail
3.2
AA Large
1.4
Fail
—
1.9
Fail
4.4
AA Large
1.7
Fail
2.6
Fail
1.9
Fail
—
White BG
19.4AAA
2.5Fail
11.3AAA
8.1AAA
4.4AA Large
Black BG
1.1Fail
8.4AAA
1.9Fail
2.6Fail
4.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

080814
989933
3F3E53
545370
7B79AD

Deuteranopia

080713
96933D
454D4D
5C6568
8695A1

Tritanopia

041212
87535A
663F3B
865650
C5857C

Achromatopsia

0C0C0C
929292
303030
404040
5F5F5F

Shades & Tints Shades & Tints

#030F15

Dark
Light

#85B20B

Dark
Light

#6B066B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #030f15;
  --color-2: #85b20b;
  --color-3: #6b066b;
  --color-4: #8d0991;
  --color-5: #cf0de0;
}

SCSS

$color-1: #030f15;
$color-2: #85b20b;
$color-3: #6b066b;
$color-4: #8d0991;
$color-5: #cf0de0;

TAILWIND

colors: {
  'brand-1': '#030f15',
  'brand-2': '#85b20b',
  'brand-3': '#6b066b',
  'brand-4': '#8d0991',
  'brand-5': '#cf0de0',
}

RGB Array

[3, 15, 21], [133, 178, 11], [107, 6, 107], [141, 9, 145], [207, 13, 224]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #030F15, #85B20B, #6B066B, #8D0991, #CF0DE0 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: #030f15; --color-2: #85b20b; --color-3: #6b066b; --color-4: #8d0991; --color-5: #cf0de0. 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