Named color · #E96A97
Shadow Azalea Pink
Shadow Azalea Pink is #E96A97: rgb(233 106 151), hsl(339 74% 66%), oklch(0.69 0.163 0). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · Shadow Azalea Pink color name →
#E96A97
oklch(0.69 0.163 0)
Color conversions
- HEX
- #e96a97
- RGB
- rgb(233 106 151)
- HSL
- hsl(339 74% 66%)
- HWB
- hwb(339 42% 9%)
- OKLCH
- oklch(0.69 0.163 0)
- OKLab
- oklab(0.69 0.163 0)
- CIE Lab
- lab(61.94 53.32 0.72)
- LCH
- lch(61.94 53.33 0.8)
- CMYK
- cmyk(0% 55% 35% 9%)
Tints · Shades · Tones
Tints
- ED7AA1
- F18AAB
- F499B5
- F7A8BF
- FAB6CA
- FCC5D4
- FDD3DF
- FEE2E9
- FFF0F4
Shades
- CB5B83
- AD4D6F
- 903F5C
- 743149
- 5A2437
- 411826
- 290D17
- 130408
- 030001
Tones
- DF6E95
- D57192
- CB7490
- C1768E
- B7798B
- AD7B89
- A27C87
- 977E85
- 8C7F82
Color harmonies
Complementary +180°
- E96A97
Shadow Azalea Pink
- 00B49E
≈ Aare River
Analogous -30° +30°
- E96A97
Shadow Azalea Pink
- D272CB
≈ French Mauve
- EF6E5C
≈ Autumn Enchantment
Triadic +120° +240°
- E96A97
Shadow Azalea Pink
- 8FA903
≈ Augustus Asparagus
- 00A5F2
≈ Rockman Blue
Split-complementary +150° +210°
- E96A97
Shadow Azalea Pink
- 3BB662
≈ Cool Green
- 00AFC4
≈ Havasupai Falls
Tetradic +90° +180° +270°
- E96A97
Shadow Azalea Pink
- BD9600
≈ Hidden Tribe
- 00B49E
≈ Aare River
- 7593FF
≈ Punch Out Glove
Contrast & accessibility
Ag
FailOn white
WCAG 3.01:1 · APCA Lc 56
Ag
AAOn black
WCAG 6.97:1 · APCA Lc 46
Best text color: #000000
WCAG 6.97:1 (AA) · APCA Lc 46
Contrast pairs
Code snippets
CSS
:root {
--shadow-azalea-pink: #e96a97;
--shadow-azalea-pink-rgb: 233 106 151;
--shadow-azalea-pink-oklch: oklch(0.69 0.163 0);
}
.element {
color: var(--shadow-azalea-pink);
background-color: hsl(339 74% 66%);
border-color: oklch(0.69 0.163 0);
}Tailwind CSS v4
@theme {
--color-shadow-azalea-pink: #e96a97;
--color-shadow-azalea-pink-50: #ffe2f1;
--color-shadow-azalea-pink-100: #ffd2e3;
--color-shadow-azalea-pink-200: #ffb7cf;
--color-shadow-azalea-pink-300: #fc92b1;
--color-shadow-azalea-pink-400: #e9719a;
--color-shadow-azalea-pink-500: #d74c82;
--color-shadow-azalea-pink-600: #b5426e;
--color-shadow-azalea-pink-700: #923458;
--color-shadow-azalea-pink-800: #6c2542;
--color-shadow-azalea-pink-900: #4c192e;
--color-shadow-azalea-pink-950: #32091a;
}SCSS
$shadow-azalea-pink: #e96a97;
$shadow-azalea-pink-rgb: 233, 106, 151;
$shadow-azalea-pink-light: mix(#fff, $shadow-azalea-pink, 20%);
$shadow-azalea-pink-dark: mix(#000, $shadow-azalea-pink, 20%);
.element {
color: $shadow-azalea-pink;
box-shadow: 0 0 0 2px rgba($shadow-azalea-pink, 0.35);
}