Named color · #F42C93
Prickly Pink
Prickly Pink is #F42C93: rgb(244 44 147), hsl(329 90% 56%), oklch(0.646 0.242 355.8). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · Prickly Pink color name →
#F42C93
oklch(0.646 0.242 355.8)
Color conversions
- HEX
- #f42c93
- RGB
- rgb(244 44 147)
- HSL
- hsl(329 90% 56%)
- HWB
- hwb(329 17% 4%)
- OKLCH
- oklch(0.646 0.242 355.8)
- OKLab
- oklab(0.646 0.241 -0.017)
- CIE Lab
- lab(55.79 77.22 -5.61)
- LCH
- lch(55.79 77.43 355.8)
- CMYK
- cmyk(0% 82% 40% 4%)
Tints · Shades · Tones
Tints
- F84D9D
- FC66A8
- FF7CB2
- FF90BD
- FFA3C8
- FFB6D3
- FFC9DE
- FFDBE9
- FFEDF4
Shades
- D4257F
- B51E6C
- 971759
- 7A1147
- 5E0A36
- 440525
- 2B0216
- 140108
- 030001
Tones
- EA3E91
- E04B8F
- D5568D
- CA5E8B
- BF668A
- B46C88
- A87286
- 9B7784
- 8E7C82
Color harmonies
Complementary +180°
- F42C93
Prickly Pink
- 00A58B
≈ Brilliant Turquoise
Analogous -30° +30°
- F42C93
Prickly Pink
- D345DB
≈ Pinkish Purple
- FF2E36
≈ Pelati
Triadic +120° +240°
- F42C93
Prickly Pink
- 8A9800
≈ BioShock
- 0099D6
≈ Bayern Blue
Split-complementary +150° +210°
- F42C93
Prickly Pink
- 00AB35
≈ Carpet Moss
- 00A1AF
≈ Breaking Wave
Tetradic +90° +180° +270°
- F42C93
Prickly Pink
- B28700
≈ Arrowwood
- 00A58B
≈ Brilliant Turquoise
- 5785FF
≈ Skinny Jeans
Contrast & accessibility
Ag
FailOn white
WCAG 3.73:1 · APCA Lc 63
Ag
AAOn black
WCAG 5.62:1 · APCA Lc 39
Best text color: #000000
WCAG 5.62:1 (AA) · APCA Lc 39
Contrast pairs
Code snippets
CSS
:root {
--prickly-pink: #f42c93;
--prickly-pink-rgb: 244 44 147;
--prickly-pink-oklch: oklch(0.646 0.242 355.8);
}
.element {
color: var(--prickly-pink);
background-color: hsl(329 90% 56%);
border-color: oklch(0.646 0.242 355.8);
}Tailwind CSS v4
@theme {
--color-prickly-pink: #f42c93;
--color-prickly-pink-50: #ffd9f5;
--color-prickly-pink-100: #ffc6e8;
--color-prickly-pink-200: #ffa6d4;
--color-prickly-pink-300: #ff7ab7;
--color-prickly-pink-400: #ff4ca3;
--color-prickly-pink-500: #f3008c;
--color-prickly-pink-600: #cd0076;
--color-prickly-pink-700: #a5005f;
--color-prickly-pink-800: #7b0048;
--color-prickly-pink-900: #570232;
--color-prickly-pink-950: #3a001e;
}SCSS
$prickly-pink: #f42c93;
$prickly-pink-rgb: 244, 44, 147;
$prickly-pink-light: mix(#fff, $prickly-pink, 20%);
$prickly-pink-dark: mix(#000, $prickly-pink, 20%);
.element {
color: $prickly-pink;
box-shadow: 0 0 0 2px rgba($prickly-pink, 0.35);
}