#080D2C + #302C47 + #852E50 + #D0315C + #CB4E30 · space - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#080D2C

Indigo · Black · Deep Sea Blue

HEX

#080D2C

RGB

rgb(8, 13, 44)

HSL

hsl(232, 69%, 10%)

HSB

hsb(232, 82%, 17%)

CMYK

cmyk(82%, 70%, 0%, 83%)

Oklch

oklch(17.7% 0.063 271.4)

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

#302C47

Deep Indigo · DarkSlateGray · Prussian Blue

HEX

#302C47

RGB

rgb(48, 44, 71)

HSL

hsl(249, 23%, 23%)

HSB

hsb(249, 38%, 28%)

CMYK

cmyk(32%, 38%, 0%, 72%)

Oklch

oklch(31.0% 0.048 290.1)

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

#852E50

Dark Violet · Brown · Camellia

HEX

#852E50

RGB

rgb(133, 46, 80)

HSL

hsl(337, 49%, 35%)

HSB

hsb(337, 65%, 52%)

CMYK

cmyk(0%, 65%, 40%, 48%)

Oklch

oklch(43.8% 0.124 359.4)

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

#D0315C

Dark Violet · Crimson · Camellia

HEX

#D0315C

RGB

rgb(208, 49, 92)

HSL

hsl(344, 63%, 50%)

HSB

hsb(344, 76%, 82%)

CMYK

cmyk(0%, 76%, 56%, 18%)

Oklch

oklch(57.2% 0.195 10.6)

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

#CB4E30

Vermilion · Chocolate · Passion Red

HEX

#CB4E30

RGB

rgb(203, 78, 48)

HSL

hsl(12, 62%, 49%)

HSB

hsb(12, 76%, 80%)

CMYK

cmyk(0%, 62%, 76%, 20%)

Oklch

oklch(58.7% 0.165 34.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

080D2C

2B2608

Analogous

081E2B

080D2C

15082B

Triadic

080D2C

2B080D

0D2B08

Split-Comp.

080D2C

2B1508

1E2B08

Tetradic

080D2C

2B081E

2B2608

082B15

Contrast Matrix WCAG 2.1 Contrast

080D2C	302C47	852E50	D0315C	CB4E30
—	1.4 Fail	2.3 Fail	3.9 AA Large	4.2 AA Large
1.4 Fail	—	1.6 Fail	2.7 Fail	3.0 Fail
2.3 Fail	1.6 Fail	—	1.7 Fail	1.9 Fail
3.9 AA Large	2.7 Fail	1.7 Fail	—	1.1 Fail
4.2 AA Large	3.0 Fail	1.9 Fail	1.1 Fail	—

White BG

19.0AAA

13.3AAA

8.4AAA

4.9AA

4.5AA Large

Black BG

1.1Fail

1.6Fail

2.5Fail

4.3AA Large

4.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0A0A24

2E2E40

5F5F48

8B8A52

959437

Deuteranopia

0A0A23

2F2F3F

646B46

94A04F

9CA639

Tritanopia

081F1D

303B3A

814140

C84948

C53D3E

Achromatopsia

0F0F0F

303030

4C4C4C

656565

707070

Shades & Tints Shades & Tints

#080D2C

Dark

Light

#302C47

Dark

Light

#852E50

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #080d2c;
  --color-2: #302c47;
  --color-3: #852e50;
  --color-4: #d0315c;
  --color-5: #cb4e30;
}

SCSS

$color-1: #080d2c;
$color-2: #302c47;
$color-3: #852e50;
$color-4: #d0315c;
$color-5: #cb4e30;

TAILWIND

colors: {
  'brand-1': '#080d2c',
  'brand-2': '#302c47',
  'brand-3': '#852e50',
  'brand-4': '#d0315c',
  'brand-5': '#cb4e30',
}

RGB Array

[8, 13, 44], [48, 44, 71], [133, 46, 80], [208, 49, 92], [203, 78, 48]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #080D2C, #302C47, #852E50, #D0315C, #CB4E30 is ideal for: tech websites, dark mode UIs, game UIs. 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: #080d2c; --color-2: #302c47; --color-3: #852e50; --color-4: #d0315c; --color-5: #cb4e30. 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. 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