Warna bernama terdekat · #FF20B3
#FF20B3
Warna bernama terdekat: Pink Hysteria
#FF20B3 (rgb(255 32 179), hsl(320 100% 56%), oklch(0.671 0.27 347.6)) paling mendekati warna bernama Pink Hysteria. Lihat tint, shade, harmoni, kontras WCAG & APCA, serta kode CSS, Tailwind v4, dan SCSS.
#FF20B3
oklch(0.671 0.27 347.6)
Konversi warna
- HEX
- #ff20b3
- RGB
- rgb(255 32 179)
- HSL
- hsl(320 100% 56%)
- HWB
- hwb(320 13% 0%)
- OKLCH
- oklch(0.671 0.27 347.6)
- OKLab
- oklab(0.671 0.263 -0.058)
- CIE Lab
- lab(58.05 84.13 -20.75)
- LCH
- lch(58.05 86.65 346.1)
- CMYK
- cmyk(0% 87% 30% 0%)
Tint · Shade · Tone
Tint
- FF49BB
- FF64C2
- FF7BCA
- FF90D2
- FFA4D9
- FFB7E1
- FFC9E8
- FFDBF0
- FFEDF7
Shade
- DE1A9B
- BE1584
- 9E0F6E
- 800A58
- 630643
- 48032F
- 2E011D
- 16000C
- 030001
Tone
- F439AE
- E849A9
- DC54A4
- D15E9F
- C4669A
- B86D95
- AB728F
- 9D788A
- 8F7C85
Harmoni warna
Komplementer +180°
- FF20B3
Pink Hysteria
- 00AF84
≈ Dark Mountain Meadow
Analog -30° +30°
- FF20B3
Pink Hysteria
- D546FE
≈ Geisha Pink
- FF4761
≈ Magic Potion
Triadik +120° +240°
- FF20B3
Pink Hysteria
- 9F9B00
≈ Papyrus
- 00A4D3
≈ Charybdis
Split-komplementer +150° +210°
- FF20B3
Pink Hysteria
- 4BB000
≈ Kermit Green
- 00AAAE
≈ Fiji
Tetradik +90° +180° +270°
- FF20B3
Pink Hysteria
- C48800
≈ Auric
- 00AF84
≈ Dark Mountain Meadow
- 4894FF
≈ Polar Glow
Kontras & aksesibilitas
Ag
FailDi atas putih
WCAG 3.43:1 · APCA Lc 60
Ag
AADi atas hitam
WCAG 6.10:1 · APCA Lc 42
Warna teks terbaik: #000000
WCAG 6.10:1 (AA) · APCA Lc 42
Contrast pairs
Cuplikan kode
CSS
:root {
--pink-hysteria: #ff20b3;
--pink-hysteria-rgb: 255 32 179;
--pink-hysteria-oklch: oklch(0.671 0.27 347.6);
}
.element {
color: var(--pink-hysteria);
background-color: hsl(320 100% 56%);
border-color: oklch(0.671 0.27 347.6);
}Tailwind CSS v4
@theme {
--color-pink-hysteria: #ff20b3;
--color-pink-hysteria-50: #ffd6ff;
--color-pink-hysteria-100: #ffc2f5;
--color-pink-hysteria-200: #ffa1e5;
--color-pink-hysteria-300: #ff72cc;
--color-pink-hysteria-400: #ff3ebb;
--color-pink-hysteria-500: #f400a6;
--color-pink-hysteria-600: #ce008c;
--color-pink-hysteria-700: #a60070;
--color-pink-hysteria-800: #7b0056;
--color-pink-hysteria-900: #57003c;
--color-pink-hysteria-950: #3a0026;
}SCSS
$pink-hysteria: #ff20b3;
$pink-hysteria-rgb: 255, 32, 179;
$pink-hysteria-light: mix(#fff, $pink-hysteria, 20%);
$pink-hysteria-dark: mix(#000, $pink-hysteria, 20%);
.element {
color: $pink-hysteria;
box-shadow: 0 0 0 2px rgba($pink-hysteria, 0.35);
}