Cor nomeada · #F970AC
Crazy Pink
Crazy Pink é #F970AC: rgb(249 112 172), hsl(334 92% 71%), oklch(0.726 0.178 355). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Red mean? → · Crazy Pink color name →
#F970AC
oklch(0.726 0.178 355)
Conversões de cor
- HEX
- #f970ac
- RGB
- rgb(249 112 172)
- HSL
- hsl(334 92% 71%)
- HWB
- hwb(334 44% 2%)
- OKLCH
- oklch(0.726 0.178 355)
- OKLab
- oklab(0.726 0.177 -0.015)
- CIE Lab
- lab(65.9 57.72 -5.18)
- LCH
- lch(65.9 57.95 354.9)
- CMYK
- cmyk(0% 55% 31% 2%)
Tons claros · Sombras · Tons
Tons claros
- FC80B4
- FE8FBC
- FF9EC4
- FFACCD
- FFBAD5
- FFC8DD
- FFD6E6
- FFE4EE
- FFF1F6
Sombras
- D96095
- B9517F
- 9A4369
- 7D3554
- 612740
- 461A2D
- 2C0E1B
- 15040B
- 030101
Tons
- ED73A8
- E276A3
- D6789F
- CB7A9A
- BF7C96
- B37D91
- A77E8D
- 9A7F89
- 8D8084
Harmonias de cor
Complementar +180°
- F970AC
Crazy Pink
- 00C2A2
≈ Turquoise
Análoga -30° +30°
- F970AC
Crazy Pink
- DD7AE3
≈ Hibiscus Pop
- FF756F
≈ Embarrassment
Tríade +120° +240°
- F970AC
Crazy Pink
- A4B100
≈ Marker Green
- 00B4F8
≈ Blue Bolt
Complementar dividida +150° +210°
- F970AC
Crazy Pink
- 50C25A
≈ Range Land
- 00BCCB
≈ Panorama Blue
Tétrade +90° +180° +270°
- F970AC
Crazy Pink
- D19D00
≈ Lepton Gold
- 00C2A2
≈ Turquoise
- 7BA3FF
≈ Fennel Flower
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.64:1 · APCA Lc 51
Ag
AAASobre preto
WCAG 7.94:1 · APCA Lc 51
Melhor cor de texto: #000000
WCAG 7.94:1 (AAA) · APCA Lc 51
Contrast pairs
Trechos de código
CSS
:root {
--crazy-pink: #f970ac;
--crazy-pink-rgb: 249 112 172;
--crazy-pink-oklch: oklch(0.726 0.178 355);
}
.element {
color: var(--crazy-pink);
background-color: hsl(334 92% 71%);
border-color: oklch(0.726 0.178 355);
}Tailwind CSS v4
@theme {
--color-crazy-pink: #f970ac;
--color-crazy-pink-50: #ffe1f6;
--color-crazy-pink-100: #ffd0e9;
--color-crazy-pink-200: #ffb4d5;
--color-crazy-pink-300: #ff8fb9;
--color-crazy-pink-400: #ec6ba4;
--color-crazy-pink-500: #da448c;
--color-crazy-pink-600: #b83c76;
--color-crazy-pink-700: #942f5f;
--color-crazy-pink-800: #6e2148;
--color-crazy-pink-900: #4d1632;
--color-crazy-pink-950: #33061e;
}SCSS
$crazy-pink: #f970ac;
$crazy-pink-rgb: 249, 112, 172;
$crazy-pink-light: mix(#fff, $crazy-pink, 20%);
$crazy-pink-dark: mix(#000, $crazy-pink, 20%);
.element {
color: $crazy-pink;
box-shadow: 0 0 0 2px rgba($crazy-pink, 0.35);
}