#281A1B + #431E31 + #501938 + #691334 + #7C182A - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#281A1B

Crimson · Black · Deep Berry

HEX

#281A1B

RGB

rgb(40, 26, 27)

HSL

hsl(356, 21%, 13%)

HSB

hsb(356, 35%, 16%)

CMYK

cmyk(0%, 35%, 33%, 84%)

Oklch

oklch(23.6% 0.022 14.2)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#431E31

Rose Purple · DarkSlateGray · Raspberry

HEX

#431E31

RGB

rgb(67, 30, 49)

HSL

hsl(329, 38%, 19%)

HSB

hsb(329, 55%, 26%)

CMYK

cmyk(0%, 55%, 27%, 74%)

Oklch

oklch(29.4% 0.063 349.6)

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

#501938

Rose Purple · DarkSlateGray · Raspberry

HEX

#501938

RGB

rgb(80, 25, 56)

HSL

hsl(326, 52%, 21%)

HSB

hsb(326, 69%, 31%)

CMYK

cmyk(0%, 69%, 30%, 69%)

Oklch

oklch(31.1% 0.091 348.8)

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

#691334

Dark Violet · Maroon · Raspberry

HEX

#691334

RGB

rgb(105, 19, 52)

HSL

hsl(337, 69%, 24%)

HSB

hsb(337, 82%, 41%)

CMYK

cmyk(0%, 82%, 50%, 59%)

Oklch

oklch(35.0% 0.121 3.2)

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

#7C182A

Vermilion · Brown · Wine Red

HEX

#7C182A

RGB

rgb(124, 24, 42)

HSL

hsl(349, 68%, 29%)

HSB

hsb(349, 81%, 49%)

CMYK

cmyk(0%, 81%, 66%, 51%)

Oklch

oklch(38.8% 0.134 16.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

281A1B

1A2827

Analogous

281A22

281A1B

28201A

Triadic

281A1B

1B281A

1A1B28

Split-Comp.

281A1B

1A2820

1A2228

Tetradic

281A1B

22281A

1A2827

201A28

Contrast Matrix WCAG 2.1 Contrast

281A1B	431E31	501938	691334	7C182A
—	1.2 Fail	1.2 Fail	1.4 Fail	1.6 Fail
1.2 Fail	—	1.0 Fail	1.2 Fail	1.4 Fail
1.2 Fail	1.0 Fail	—	1.1 Fail	1.3 Fail
1.4 Fail	1.2 Fail	1.1 Fail	—	1.2 Fail
1.6 Fail	1.4 Fail	1.3 Fail	1.2 Fail	—

White BG

16.7AAA

14.3AAA

13.7AAA

12.0AAA

10.4AAA

Black BG

1.3Fail

1.5Fail

1.7Fail

2.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

22221B

33332C

383830

44432C

515026

Deuteranopia

23241B

35382B

3B402F

494F2A

575E25

Tritanopia

271B1B

412928

4D2B29

652624

772221

Achromatopsia

1E1E1E

2B2B2B

2D2D2D

303030

383838

Shades & Tints Shades & Tints

#281A1B

Dark

Light

#431E31

Dark

Light

#501938

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #281a1b;
  --color-2: #431e31;
  --color-3: #501938;
  --color-4: #691334;
  --color-5: #7c182a;
}

SCSS

$color-1: #281a1b;
$color-2: #431e31;
$color-3: #501938;
$color-4: #691334;
$color-5: #7c182a;

TAILWIND

colors: {
  'brand-1': '#281a1b',
  'brand-2': '#431e31',
  'brand-3': '#501938',
  'brand-4': '#691334',
  'brand-5': '#7c182a',
}

RGB Array

[40, 26, 27], [67, 30, 49], [80, 25, 56], [105, 19, 52], [124, 24, 42]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #281A1B, #431E31, #501938, #691334, #7C182A 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: #281a1b; --color-2: #431e31; --color-3: #501938; --color-4: #691334; --color-5: #7c182a. 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