#190E15 + #5C1E31 + #5F4863 + #57709D + #45A0AF · sunset - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#190E15

Rose Purple · Black · Raspberry

HEX

#190E15

RGB

rgb(25, 14, 21)

HSL

hsl(322, 28%, 8%)

HSB

hsb(322, 44%, 10%)

CMYK

cmyk(0%, 44%, 16%, 90%)

Oklch

oklch(18.2% 0.023 341.1)

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

#5C1E31

Dark Violet · Maroon · Raspberry

HEX

#5C1E31

RGB

rgb(92, 30, 49)

HSL

hsl(342, 51%, 24%)

HSB

hsb(342, 67%, 36%)

CMYK

cmyk(0%, 67%, 47%, 64%)

Oklch

oklch(33.7% 0.092 4.6)

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

#5F4863

Dark Plum · DimGray · Eggplant

HEX

#5F4863

RGB

rgb(95, 72, 99)

HSL

hsl(291, 16%, 34%)

HSB

hsb(291, 27%, 39%)

CMYK

cmyk(4%, 27%, 0%, 61%)

Oklch

oklch(43.6% 0.052 321.4)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#57709D

Indigo · SlateGray · Navy Blue

HEX

#57709D

RGB

rgb(87, 112, 157)

HSL

hsl(219, 29%, 48%)

HSB

hsb(219, 45%, 62%)

CMYK

cmyk(45%, 29%, 0%, 38%)

Oklch

oklch(54.4% 0.077 261.8)

Traditional「Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#45A0AF

Slate Blue · CadetBlue · Mint Ice

HEX

#45A0AF

RGB

rgb(69, 160, 175)

HSL

hsl(188, 43%, 48%)

HSB

hsb(188, 61%, 69%)

CMYK

cmyk(61%, 9%, 0%, 31%)

Oklch

oklch(65.7% 0.088 209.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

190E15

0F1A13

Analogous

190F1A

190E15

1A0F10

Triadic

190E15

161A0F

0F161A

Split-Comp.

190E15

101A0F

0F1A19

Tetradic

190E15

1A190F

0F1A13

0F101A

Contrast Matrix WCAG 2.1 Contrast

190E15	5C1E31	5F4863	57709D	45A0AF
—	1.5 Fail	2.3 Fail	3.8 AA Large	6.2 AA
1.5 Fail	—	1.5 Fail	2.5 Fail	4.1 AA Large
2.3 Fail	1.5 Fail	—	1.6 Fail	2.7 Fail
3.8 AA Large	2.5 Fail	1.6 Fail	—	1.6 Fail
6.2 AA	4.1 AA Large	2.7 Fail	1.6 Fail	—

White BG

18.8AAA

12.5AAA

8.1AAA

5.0AA

3.0AA Large

Black BG

1.1Fail

1.7Fail

2.6Fail

4.2AA Large

6.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

141413

41412C

55555C

626292

6C6DAB

Deuteranopia

151613

45492B

56585B

605F90

6760AB

Tritanopia

181212

592928

5E5756

588A88

4AA9A8

Achromatopsia

121212

333333

525252

6E6E6E

878787

Shades & Tints Shades & Tints

#190E15

Dark

Light

#5C1E31

Dark

Light

#5F4863

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #190e15;
  --color-2: #5c1e31;
  --color-3: #5f4863;
  --color-4: #57709d;
  --color-5: #45a0af;
}

SCSS

$color-1: #190e15;
$color-2: #5c1e31;
$color-3: #5f4863;
$color-4: #57709d;
$color-5: #45a0af;

TAILWIND

colors: {
  'brand-1': '#190e15',
  'brand-2': '#5c1e31',
  'brand-3': '#5f4863',
  'brand-4': '#57709d',
  'brand-5': '#45a0af',
}

RGB Array

[25, 14, 21], [92, 30, 49], [95, 72, 99], [87, 112, 157], [69, 160, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #190E15, #5C1E31, #5F4863, #57709D, #45A0AF 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: #190e15; --color-2: #5c1e31; --color-3: #5f4863; --color-4: #57709d; --color-5: #45a0af. 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 sunset-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