← Back to Editor

#11081E · #316067 · #527D60 · #BA5E5A · #7233D7

space

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#11081E

Deep Indigo · Black · Dark Purple

HEX
#11081E
RGB
rgb(17, 8, 30)
HSL
hsl(265, 58%, 7%)
HSB
hsb(265, 73%, 12%)
CMYK
cmyk(43%, 73%, 0%, 88%)
Oklch
oklch(16.2% 0.046 300.4)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

#316067

Slate Blue · DarkSlateGray · Mint Ice

HEX
#316067
RGB
rgb(49, 96, 103)
HSL
hsl(188, 36%, 30%)
HSB
hsb(188, 52%, 40%)
CMYK
cmyk(52%, 7%, 0%, 60%)
Oklch
oklch(45.9% 0.052 208.0)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#527D60

Celadon · DimGray · Olive Green

HEX
#527D60
RGB
rgb(82, 125, 96)
HSL
hsl(140, 21%, 41%)
HSB
hsb(140, 34%, 49%)
CMYK
cmyk(34%, 0%, 23%, 51%)
Oklch
oklch(55.0% 0.066 154.2)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#BA5E5A

Crimson · Sienna · Passion Red

HEX
#BA5E5A
RGB
rgb(186, 94, 90)
HSL
hsl(3, 41%, 54%)
HSB
hsb(3, 52%, 73%)
CMYK
cmyk(0%, 49%, 52%, 27%)
Oklch
oklch(59.1% 0.119 23.9)

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

#7233D7

Deep Indigo · DarkOrchid · Violet

HEX
#7233D7
RGB
rgb(114, 51, 215)
HSL
hsl(263, 67%, 52%)
HSB
hsb(263, 76%, 84%)
CMYK
cmyk(47%, 76%, 0%, 16%)
Oklch
oklch(50.5% 0.230 293.9)

Traditional「Deep Indigo」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

11081E
141C07

Analogous

07091C
11081E
1A071C

Triadic

11081E
1C1007
071C10

Split-Comp.

11081E
1C1A07
091C07

Tetradic

11081E
1C0709
141C07
071C1A

Contrast Matrix WCAG 2.1 Contrast

11081E
316067
527D60
BA5E5A
7233D7
—
2.8
Fail
4.1
AA Large
4.5
AA Large
2.9
Fail
2.8
Fail
—
1.5
Fail
1.6
Fail
1.1
Fail
4.1
AA Large
1.5
Fail
—
1.1
Fail
1.4
Fail
4.5
AA Large
1.6
Fail
1.1
Fail
—
1.5
Fail
2.9
Fail
1.1
Fail
1.4
Fail
1.5
Fail
—
White BG
19.5AAA
7.0AAA
4.7AA
4.3AA Large
6.6AA
Black BG
1.1Fail
3.0Fail
4.5AA Large
4.8AA
3.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

0D0D19
454665
656567
92915B
5756AF

Deuteranopia

0E0E17
433F65
625F69
989E5B
5A5FA6

Tritanopia

111414
336464
546D6E
B55C5C
6F9089

Achromatopsia

0D0D0D
535353
6D6D6D
797979
595959

Shades & Tints Shades & Tints

#11081E

Dark
Light

#316067

Dark
Light

#527D60

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #11081e;
  --color-2: #316067;
  --color-3: #527d60;
  --color-4: #ba5e5a;
  --color-5: #7233d7;
}

SCSS

$color-1: #11081e;
$color-2: #316067;
$color-3: #527d60;
$color-4: #ba5e5a;
$color-5: #7233d7;

TAILWIND

colors: {
  'brand-1': '#11081e',
  'brand-2': '#316067',
  'brand-3': '#527d60',
  'brand-4': '#ba5e5a',
  'brand-5': '#7233d7',
}

RGB Array

[17, 8, 30], [49, 96, 103], [82, 125, 96], [186, 94, 90], [114, 51, 215]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #11081E, #316067, #527D60, #BA5E5A, #7233D7 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: #11081e; --color-2: #316067; --color-3: #527d60; --color-4: #ba5e5a; --color-5: #7233d7. 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 space-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