En yakın adlandırılmış renk · #FC4CCF
#FC4CCF
En yakın adlandırılmış renk: Purple Pizzazz
#FC4CCF (rgb(252 76 207), hsl(315 97% 64%), oklch(0.705 0.247 340)) en çok Purple Pizzazz adlı renge yakındır. Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
#FC4CCF
oklch(0.705 0.247 340)
Renk dönüşümleri
- HEX
- #fc4ccf
- RGB
- rgb(252 76 207)
- HSL
- hsl(315 97% 64%)
- HWB
- hwb(315 30% 1%)
- OKLCH
- oklch(0.705 0.247 340)
- OKLab
- oklab(0.705 0.232 -0.085)
- CIE Lab
- lab(62.19 75.52 -30.53)
- LCH
- lch(62.19 81.46 338)
- CMYK
- cmyk(0% 70% 18% 1%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- FF64D4
- FF78D9
- FF8BDE
- FF9DE3
- FFAEE8
- FFBFED
- FFCFF1
- FFDFF6
- FFEFFB
Koyu tonlar
- DB41B4
- BB3699
- 9C2C7F
- 7E2267
- 62184F
- 470F38
- 2D0623
- 160210
- 030002
Gri tonlar
- F056C7
- E55EBF
- D965B7
- CD6BAF
- C170A8
- B574A0
- A87898
- 9B7B90
- 8E7E88
Renk uyumları
Tamamlayıcı +180°
- FC4CCF
Purple Pizzazz
- 00BD7D
≈ Fennel Fiesta
Analog -30° +30°
- FC4CCF
Purple Pizzazz
- C772FF
≈ Easter Purple
- FF6184
≈ Brink Pink
Üçlü +120° +240°
- FC4CCF
Purple Pizzazz
- B6A100
≈ Snakebite Leather
- 00B2D7
≈ Aquarius
Bölünmüş tamamlayıcı +150° +210°
- FC4CCF
Purple Pizzazz
- 77B500
≈ Leaf Sheep
- 00B8B1
≈ Jade Gravel
Dörtlü +90° +180° +270°
- FC4CCF
Purple Pizzazz
- DB8C00
≈ Non-Stop Orange
- 00BD7D
≈ Fennel Fiesta
- 44A4FF
≈ Xed
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.96:1 · APCA Lc 55
Ag
AAASiyah üzerinde
WCAG 7.07:1 · APCA Lc 47
En iyi metin rengi: #000000
WCAG 7.07:1 (AAA) · APCA Lc 47
Contrast pairs
Kod parçacıkları
CSS
:root {
--purple-pizzazz: #fc4ccf;
--purple-pizzazz-rgb: 252 76 207;
--purple-pizzazz-oklch: oklch(0.705 0.247 340);
}
.element {
color: var(--purple-pizzazz);
background-color: hsl(315 97% 64%);
border-color: oklch(0.705 0.247 340);
}Tailwind CSS v4
@theme {
--color-purple-pizzazz: #fc4ccf;
--color-purple-pizzazz-50: #ffd9ff;
--color-purple-pizzazz-100: #ffc7ff;
--color-purple-pizzazz-200: #ffa8f2;
--color-purple-pizzazz-300: #ff7dda;
--color-purple-pizzazz-400: #f652cb;
--color-purple-pizzazz-500: #e500b8;
--color-purple-pizzazz-600: #c10a9b;
--color-purple-pizzazz-700: #9b0c7d;
--color-purple-pizzazz-800: #73075f;
--color-purple-pizzazz-900: #510643;
--color-purple-pizzazz-950: #36002b;
}SCSS
$purple-pizzazz: #fc4ccf;
$purple-pizzazz-rgb: 252, 76, 207;
$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);
}