Color con nombre · #FE4EDA
Purple Pizzazz
Purple Pizzazz es #FE4EDA: rgb(254 78 218), hsl(312 99% 65%), oklch(0.714 0.253 337.3). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Pink mean? → · Purple Pizzazz color name →
#FE4EDA
oklch(0.714 0.253 337.3)
Conversiones de color
- HEX
- #fe4eda
- RGB
- rgb(254 78 218)
- HSL
- hsl(312 99% 65%)
- HWB
- hwb(312 31% 0%)
- OKLCH
- oklch(0.714 0.253 337.3)
- OKLab
- oklab(0.714 0.234 -0.098)
- CIE Lab
- lab(63.15 76.46 -35.22)
- LCH
- lch(63.15 84.18 335.3)
- CMYK
- cmyk(0% 69% 14% 0%)
Tintes · Sombras · Tonos
Tintes
- FF66DE
- FF7AE2
- FF8DE6
- FF9FEA
- FFAFEE
- FFC0F2
- FFD0F5
- FFE0F8
- FFEFFC
Sombras
- DD43BD
- BD38A2
- 9E2D87
- 80236C
- 631954
- 470F3C
- 2D0725
- 160211
- 030002
Tonos
- F258D1
- E660C8
- DA67BF
- CE6CB6
- C271AD
- B575A4
- A9799B
- 9C7C92
- 8E7E89
Armonías de color
Complementario +180°
- FE4EDA
Purple Pizzazz
- 00C177
≈ Times Square Screens
Análogo -30° +30°
- FE4EDA
Purple Pizzazz
- C37CFF
≈ Rosy Fluffy Bedspread
- FF678E
≈ Berlin Pink
Triádico +120° +240°
- FE4EDA
Purple Pizzazz
- BDA200
≈ Snakebite Leather
- 00B5D7
≈ Ocean Sigh
Complementario dividido +150° +210°
- FE4EDA
Purple Pizzazz
- 83B700
≈ Dark Lime
- 00BBB0
≈ Turquoise Topaz
Tetrádico +90° +180° +270°
- FE4EDA
Purple Pizzazz
- E38C00
≈ Hotter Butter
- 00C177
≈ Times Square Screens
- 41A9FF
≈ Xed
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 2.87:1 · APCA Lc 54
Ag
AAASobre negro
WCAG 7.31:1 · APCA Lc 48
Mejor color de texto: #000000
WCAG 7.31:1 (AAA) · APCA Lc 48
Contrast pairs
Fragmentos de código
CSS
:root {
--purple-pizzazz: #fe4eda;
--purple-pizzazz-rgb: 254 78 218;
--purple-pizzazz-oklch: oklch(0.714 0.253 337.3);
}
.element {
color: var(--purple-pizzazz);
background-color: hsl(312 99% 65%);
border-color: oklch(0.714 0.253 337.3);
}Tailwind CSS v4
@theme {
--color-purple-pizzazz: #fe4eda;
--color-purple-pizzazz-50: #ffd9ff;
--color-purple-pizzazz-100: #ffc7ff;
--color-purple-pizzazz-200: #ffa7f7;
--color-purple-pizzazz-300: #ff7ce1;
--color-purple-pizzazz-400: #f550d3;
--color-purple-pizzazz-500: #e300c0;
--color-purple-pizzazz-600: #c003a2;
--color-purple-pizzazz-700: #9a0882;
--color-purple-pizzazz-800: #720563;
--color-purple-pizzazz-900: #500546;
--color-purple-pizzazz-950: #35002d;
}SCSS
$purple-pizzazz: #fe4eda;
$purple-pizzazz-rgb: 254, 78, 218;
$purple-pizzazz-light: mix(#fff, $purple-pizzazz, 20%);
$purple-pizzazz-dark: mix(#000, $purple-pizzazz, 20%);
.element {
color: $purple-pizzazz;
box-shadow: 0 0 0 2px rgba($purple-pizzazz, 0.35);
}