#F22859 + #91717D + #595678 + #3C3750 + #33263C - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#F22859

Vermilion · Crimson · Passion Red

HEX

#F22859

RGB

rgb(242, 40, 89)

HSL

hsl(345, 89%, 55%)

HSB

hsb(345, 83%, 95%)

CMYK

cmyk(0%, 83%, 63%, 5%)

Oklch

oklch(62.5% 0.231 14.9)

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

#91717D

Dark Violet · Gray · Rose Pink

HEX

#91717D

RGB

rgb(145, 113, 125)

HSL

hsl(338, 13%, 51%)

HSB

hsb(338, 22%, 57%)

CMYK

cmyk(0%, 22%, 14%, 43%)

Oklch

oklch(58.4% 0.044 354.1)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#595678

Deep Indigo · DimGray · Prussian Blue

HEX

#595678

RGB

rgb(89, 86, 120)

HSL

hsl(245, 17%, 40%)

HSB

hsb(245, 28%, 47%)

CMYK

cmyk(26%, 28%, 0%, 53%)

Oklch

oklch(47.0% 0.055 288.1)

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

#3C3750

Deep Indigo · DarkSlateGray · Prussian Blue

HEX

#3C3750

RGB

rgb(60, 55, 80)

HSL

hsl(252, 19%, 26%)

HSB

hsb(252, 31%, 31%)

CMYK

cmyk(25%, 31%, 0%, 69%)

Oklch

oklch(35.3% 0.043 293.2)

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

#33263C

Dark Plum · DarkSlateGray · Dark Purple

HEX

#33263C

RGB

rgb(51, 38, 60)

HSL

hsl(275, 22%, 19%)

HSB

hsb(275, 37%, 24%)

CMYK

cmyk(15%, 37%, 0%, 76%)

Oklch

oklch(29.4% 0.043 310.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F22859

26F2BF

Analogous

F226BF

F22859

F25926

Triadic

F22859

59F226

2659F2

Split-Comp.

F22859

26F259

26BFF2

Tetradic

F22859

BFF226

26F2BF

5926F2

Contrast Matrix WCAG 2.1 Contrast

F22859	91717D	595678	3C3750	33263C
—	1.1 Fail	1.7 Fail	2.8 Fail	3.5 AA Large
1.1 Fail	—	1.6 Fail	2.6 Fail	3.3 AA Large
1.7 Fail	1.6 Fail	—	1.6 Fail	2.0 Fail
2.8 Fail	2.6 Fail	1.6 Fail	—	1.3 Fail
3.5 AA Large	3.3 AA Large	2.0 Fail	1.3 Fail	—

White BG

4.0AA Large

4.3AA Large

6.9AA

11.3AAA

14.2AAA

Black BG

5.2AA

4.9AA

3.0AA Large

1.9Fail

1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

9B994D

83837A

585870

3A3A4A

2D2D37

Deuteranopia

A6B54A

858779

58586E

3A3B49

2E2F35

Tritanopia

E84442

8F7877

596968

3C4544

323232

Achromatopsia

6A6A6A

7C7C7C

5B5B5B

3B3B3B

2C2C2C

Shades & Tints Shades & Tints

#F22859

Dark

Light

#91717D

Dark

Light

#595678

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f22859;
  --color-2: #91717d;
  --color-3: #595678;
  --color-4: #3c3750;
  --color-5: #33263c;
}

SCSS

$color-1: #f22859;
$color-2: #91717d;
$color-3: #595678;
$color-4: #3c3750;
$color-5: #33263c;

TAILWIND

colors: {
  'brand-1': '#f22859',
  'brand-2': '#91717d',
  'brand-3': '#595678',
  'brand-4': '#3c3750',
  'brand-5': '#33263c',
}

RGB Array

[242, 40, 89], [145, 113, 125], [89, 86, 120], [60, 55, 80], [51, 38, 60]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F22859, #91717D, #595678, #3C3750, #33263C 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: #f22859; --color-2: #91717d; --color-3: #595678; --color-4: #3c3750; --color-5: #33263c. 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 general-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