Skip to content

#531221

a deep, vivid red · warm · closest name: maroon

RGB
83, 18, 33
HSL
346°, 64%, 20%
CMYK
0, 78, 60, 68
Luminance
0.0238

Every format

HEX#531221
RGBrgb(83, 18, 33)
HSLhsl(346, 64%, 20%)
CMYKcmyk(0%, 78%, 60%, 68%)
LABlab(17.4 30.9 7.7)
LCHlch(17.4 31.9 14.0)
OKLCHoklch(0.300 0.095 11.7)

Copy-ready code

/* CSS */
color: #531221;
background-color: #531221;
/* Tailwind (arbitrary) */
class="text-[#531221] bg-[#531221]"
/* SCSS */
$brand: #531221;
/* SwiftUI */
Color(red: 0.325, green: 0.071, blue: 0.129)
/* Android */
Color.parseColor("#531221")

Accessibility — WCAG contrast

Aa
#531221 on white: 14.22:1
AA ✓ pass · AA-large · AAA
Aa
#531221 on black: 1.48:1
AA ✗ fail · AA-large · AAA
true color
protanopia
deuteranopia
tritanopia

RGB percentages

Red32.5%
Green7.1%
Blue12.9%

CMYK percentages

Cyan0.0%
Magenta78.3%
Yellow60.2%
Key (black)67.5%

Color previews

#531221 text on a black background

contrast 1.48:1

Card sample

#531221 text on a white background

contrast 14.22:1

Card sample

CSS3 live lab

Text font color

The quick brown fox

color: #531221;
Background color
Panel with #531221 background
background-color: #531221;
Text shadow — hex

Glowing headline

text-shadow: 2px 2px 8px #531221;
Text shadow — RGB

Soft neon halo

text-shadow: 0 0 14px rgba(83, 18, 33, 0.45);
Div box shadow
Elevated card
box-shadow: 0 12px 32px -8px rgba(83, 18, 33, 0.45);
Border & gradient
Gradient panel
border: 3px solid #531221;
background: linear-gradient(135deg, #531221, #532E12);

Monochromatic scale

Palettes built from #531221

Shades — darker

Tints — lighter

Hue & tone neighbors

Color harmonies

Nearest named colors

Work with #531221 in the Color Lab