Skip to content

#ad3da2

a balanced, vivid magenta / pink · warm · closest name: purple

RGB
173, 61, 162
HSL
306°, 48%, 46%
CMYK
0, 65, 6, 32
Luminance
0.1483

Every format

HEX#ad3da2
RGBrgb(173, 61, 162)
HSLhsl(306, 48%, 46%)
CMYKcmyk(0%, 65%, 6%, 32%)
LABlab(45.4 57.5 -32.0)
LCHlch(45.4 65.8 330.9)
OKLCHoklch(0.554 0.186 331.9)

Copy-ready code

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

Accessibility — WCAG contrast

Aa
#ad3da2 on white: 5.29:1
AA ✓ pass · AA-large · AAA
Aa
#ad3da2 on black: 3.97:1
AA ✗ fail · AA-large · AAA
true color
protanopia
deuteranopia
tritanopia

RGB percentages

Red67.8%
Green23.9%
Blue63.5%

CMYK percentages

Cyan0.0%
Magenta64.7%
Yellow6.4%
Key (black)32.2%

Color previews

#ad3da2 text on a black background

contrast 3.97:1

Card sample

#ad3da2 text on a white background

contrast 5.29:1

Card sample

CSS3 live lab

Text font color

The quick brown fox

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

Glowing headline

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

Soft neon halo

text-shadow: 0 0 14px rgba(173, 61, 162, 0.45);
Div box shadow
Elevated card
box-shadow: 0 12px 32px -8px rgba(173, 61, 162, 0.45);
Border & gradient
Gradient panel
border: 3px solid #ad3da2;
background: linear-gradient(135deg, #ad3da2, #AD3D57);

Monochromatic scale

Palettes built from #ad3da2

Shades — darker

Tints — lighter

Hue & tone neighbors

Color harmonies

Nearest named colors

Work with #ad3da2 in the Color Lab