#D93B23 + #B01A36 + #471D2C + #131D24 + #467A5E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D93B23

Vermilion · FireBrick · Passion Red

HEX

#D93B23

RGB

rgb(217, 59, 35)

HSL

hsl(8, 72%, 49%)

HSB

hsb(8, 84%, 85%)

CMYK

cmyk(0%, 73%, 84%, 15%)

Oklch

oklch(58.8% 0.198 31.6)

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

#B01A36

Vermilion · FireBrick · Wine Red

HEX

#B01A36

RGB

rgb(176, 26, 54)

HSL

hsl(349, 74%, 40%)

HSB

hsb(349, 85%, 69%)

CMYK

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

Oklch

oklch(49.1% 0.182 18.4)

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

#471D2C

Dark Violet · DarkSlateGray · Raspberry

HEX

#471D2C

RGB

rgb(71, 29, 44)

HSL

hsl(339, 42%, 20%)

HSB

hsb(339, 59%, 28%)

CMYK

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

Oklch

oklch(29.7% 0.067 359.5)

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

#131D24

Slate Blue · Black · Deep Sea Blue

HEX

#131D24

RGB

rgb(19, 29, 36)

HSL

hsl(205, 31%, 11%)

HSB

hsb(205, 47%, 14%)

CMYK

cmyk(47%, 19%, 0%, 86%)

Oklch

oklch(22.4% 0.020 239.3)

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

#467A5E

Celadon · SeaGreen · Forest Green

HEX

#467A5E

RGB

rgb(70, 122, 94)

HSL

hsl(148, 27%, 38%)

HSB

hsb(148, 43%, 48%)

CMYK

cmyk(43%, 0%, 23%, 52%)

Oklch

oklch(53.5% 0.072 159.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D93B23

23BFD7

Analogous

D72365

D93B23

D79523

Triadic

D93B23

23D73B

3B23D7

Split-Comp.

D93B23

23D795

2365D7

Tetradic

D93B23

65D723

23BFD7

9523D7

Contrast Matrix WCAG 2.1 Contrast

D93B23	B01A36	471D2C	131D24	467A5E
—	1.5 Fail	3.1 AA Large	3.7 AA Large	1.1 Fail
1.5 Fail	—	2.1 Fail	2.5 Fail	1.4 Fail
3.1 AA Large	2.1 Fail	—	1.2 Fail	2.8 Fail
3.7 AA Large	2.5 Fail	1.2 Fail	—	3.4 AA Large
1.1 Fail	1.4 Fail	2.8 Fail	3.4 AA Large	—

White BG

4.6AA

6.9AA

14.2AAA

17.1AAA

5.0AA

Black BG

4.6AA

3.0AA Large

1.5Fail

1.2Fail

4.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

959329

6F6E2F

353428

171722

5D5D65

Deuteranopia

9EAA2A

78832E

373A28

171622

5A5666

Tritanopia

D12D2E

A92A29

452625

142121

496A6B

Achromatopsia

686868

4A4A4A

2B2B2B

1B1B1B

676767

Shades & Tints Shades & Tints

#D93B23

Dark

Light

#B01A36

Dark

Light

#471D2C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d93b23;
  --color-2: #b01a36;
  --color-3: #471d2c;
  --color-4: #131d24;
  --color-5: #467a5e;
}

SCSS

$color-1: #d93b23;
$color-2: #b01a36;
$color-3: #471d2c;
$color-4: #131d24;
$color-5: #467a5e;

TAILWIND

colors: {
  'brand-1': '#d93b23',
  'brand-2': '#b01a36',
  'brand-3': '#471d2c',
  'brand-4': '#131d24',
  'brand-5': '#467a5e',
}

RGB Array

[217, 59, 35], [176, 26, 54], [71, 29, 44], [19, 29, 36], [70, 122, 94]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D93B23, #B01A36, #471D2C, #131D24, #467A5E 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: #d93b23; --color-2: #b01a36; --color-3: #471d2c; --color-4: #131d24; --color-5: #467a5e. 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