#0E0F21 + #320E28 + #560C2F + #7C242C + #A13C28 · bright - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#0E0F21

Indigo · Black · Deep Sea Blue

HEX

#0E0F21

RGB

rgb(14, 15, 33)

HSL

hsl(237, 40%, 9%)

HSB

hsb(237, 58%, 13%)

CMYK

cmyk(58%, 55%, 0%, 87%)

Oklch

oklch(17.8% 0.037 279.5)

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

#320E28

Rose Purple · Black · Dark Purple

HEX

#320E28

RGB

rgb(50, 14, 40)

HSL

hsl(317, 56%, 13%)

HSB

hsb(317, 72%, 20%)

CMYK

cmyk(0%, 72%, 20%, 80%)

Oklch

oklch(23.4% 0.069 340.0)

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

#560C2F

Dark Violet · Maroon · Raspberry

HEX

#560C2F

RGB

rgb(86, 12, 47)

HSL

hsl(332, 76%, 19%)

HSB

hsb(332, 86%, 34%)

CMYK

cmyk(0%, 86%, 45%, 66%)

Oklch

oklch(30.5% 0.109 357.7)

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

#7C242C

Crimson · Brown · Wine Red

HEX

#7C242C

RGB

rgb(124, 36, 44)

HSL

hsl(355, 55%, 31%)

HSB

hsb(355, 71%, 49%)

CMYK

cmyk(0%, 71%, 65%, 51%)

Oklch

oklch(40.0% 0.121 19.5)

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

#A13C28

Crimson · Brown · Wine Red

HEX

#A13C28

RGB

rgb(161, 60, 40)

HSL

hsl(10, 60%, 39%)

HSB

hsb(10, 75%, 63%)

CMYK

cmyk(0%, 63%, 75%, 37%)

Oklch

oklch(49.4% 0.138 33.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0E0F21

201F0E

Analogous

0E1820

0E0F21

160E20

Triadic

0E0F21

200E0F

0F200E

Split-Comp.

0E0F21

20160E

18200E

Tetradic

0E0F21

200E18

201F0E

0E2016

Contrast Matrix WCAG 2.1 Contrast

0E0F21	320E28	560C2F	7C242C	A13C28
—	1.1 Fail	1.3 Fail	1.9 Fail	2.9 Fail
1.1 Fail	—	1.2 Fail	1.7 Fail	2.6 Fail
1.3 Fail	1.2 Fail	—	1.4 Fail	2.1 Fail
1.9 Fail	1.7 Fail	1.4 Fail	—	1.5 Fail
2.9 Fail	2.6 Fail	2.1 Fail	1.5 Fail	—

White BG

18.9AAA

17.1AAA

14.1AAA

9.8AAA

6.6AA

Black BG

1.1Fail

1.2Fail

1.5Fail

2.1Fail

3.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

0E0E1D

222222

363527

56552A

75742D

Deuteranopia

0E0E1C

252720

3A4025

5B622A

7B832E

Tritanopia

0E1918

301D1C

52201E

782928

9C3132

Achromatopsia

111111

1C1C1C

262626

3F3F3F

585858

Shades & Tints Shades & Tints

#0E0F21

Dark

Light

#320E28

Dark

Light

#560C2F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0e0f21;
  --color-2: #320e28;
  --color-3: #560c2f;
  --color-4: #7c242c;
  --color-5: #a13c28;
}

SCSS

$color-1: #0e0f21;
$color-2: #320e28;
$color-3: #560c2f;
$color-4: #7c242c;
$color-5: #a13c28;

TAILWIND

colors: {
  'brand-1': '#0e0f21',
  'brand-2': '#320e28',
  'brand-3': '#560c2f',
  'brand-4': '#7c242c',
  'brand-5': '#a13c28',
}

RGB Array

[14, 15, 33], [50, 14, 40], [86, 12, 47], [124, 36, 44], [161, 60, 40]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #0E0F21, #320E28, #560C2F, #7C242C, #A13C28 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: #0e0f21; --color-2: #320e28; --color-3: #560c2f; --color-4: #7c242c; --color-5: #a13c28. 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 bright-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