最接近的命名颜色 · #FF20B3
#FF20B3
最接近的命名颜色: Pink Hysteria
#FF20B3（rgb(255 32 179)、hsl(320 100% 56%)、oklch(0.671 0.27 347.6)）最接近命名颜色 Pink Hysteria。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#FF20B3
oklch(0.671 0.27 347.6)
颜色转换
- 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%)
浅色调 · 深色调 · 灰色调
浅色调
- FF49BB
- FF64C2
- FF7BCA
- FF90D2
- FFA4D9
- FFB7E1
- FFC9E8
- FFDBF0
- FFEDF7
深色调
- DE1A9B
- BE1584
- 9E0F6E
- 800A58
- 630643
- 48032F
- 2E011D
- 16000C
- 030001
灰色调
- F439AE
- E849A9
- DC54A4
- D15E9F
- C4669A
- B86D95
- AB728F
- 9D788A
- 8F7C85
配色和谐
互补色 +180°
- FF20B3
Pink Hysteria
- 00AF84
≈ Dark Mountain Meadow
类似色 -30° +30°
- FF20B3
Pink Hysteria
- D546FE
≈ Geisha Pink
- FF4761
≈ Magic Potion
三角配色 +120° +240°
- FF20B3
Pink Hysteria
- 9F9B00
≈ Papyrus
- 00A4D3
≈ Charybdis
分裂互补色 +150° +210°
- FF20B3
Pink Hysteria
- 4BB000
≈ Kermit Green
- 00AAAE
≈ Fiji
四角配色 +90° +180° +270°
- FF20B3
Pink Hysteria
- C48800
≈ Auric
- 00AF84
≈ Dark Mountain Meadow
- 4894FF
≈ Polar Glow
对比度与无障碍
Ag
Fail白底
WCAG 3.43:1 · APCA Lc 60
Ag
AA黑底
WCAG 6.10:1 · APCA Lc 42
最佳文字颜色: #000000
WCAG 6.10:1 (AA) · APCA Lc 42
Contrast pairs
代码片段
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);
}