命名颜色 · #FF33CC
Razzle Dazzle Rose
Razzle Dazzle Rose 即 #FF33CC：rgb(255 51 204)、hsl(315 100% 60%)、oklch(0.69 0.271 340.9)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Pink mean? → · Razzle Dazzle Rose color name →
#FF33CC
oklch(0.69 0.271 340.9)
颜色转换
- HEX
- #ff33cc
- RGB
- rgb(255 51 204)
- HSL
- hsl(315 100% 60%)
- HWB
- hwb(315 20% 0%)
- OKLCH
- oklch(0.69 0.271 340.9)
- OKLab
- oklab(0.69 0.256 -0.089)
- CIE Lab
- lab(60.14 82.7 -31.92)
- LCH
- lch(60.14 88.65 338.9)
- CMYK
- cmyk(0% 80% 20% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- FF54D2
- FF6CD7
- FF82DC
- FF95E1
- FFA8E7
- FFBAEC
- FFCCF1
- FFDDF6
- FFEEFA
深色调
- DE2BB1
- BE2397
- 9E1C7E
- 801465
- 630D4E
- 480737
- 2E0322
- 16010F
- 030002
灰色调
- F344C4
- E851BD
- DC5BB5
- D063AE
- C46AA6
- B7709F
- AA7597
- 9D798F
- 8F7D88
配色和谐
互补色 +180°
- FF33CC
Razzle Dazzle Rose
- 00B87B
≈ Green Teal
类似色 -30° +30°
- FF33CC
Razzle Dazzle Rose
- C768FF
≈ Jacaranda Pink
- FF567C
≈ Warm Pink
三角配色 +120° +240°
- FF33CC
Razzle Dazzle Rose
- AF9D00
≈ Lucky
- 00ACD2
≈ Hú Lán Blue
分裂互补色 +150° +210°
- FF33CC
Razzle Dazzle Rose
- 70B100
≈ Extra Life
- 00B2AD
≈ Laguna Green
四角配色 +90° +180° +270°
- FF33CC
Razzle Dazzle Rose
- D48900
≈ Fleur de Sel Caramel
- 00B87B
≈ Green Teal
- 3A9FFF
≈ Sky Dancer
对比度与无障碍
Ag
Fail白底
WCAG 3.18:1 · APCA Lc 57
Ag
AA黑底
WCAG 6.59:1 · APCA Lc 45
最佳文字颜色: #000000
WCAG 6.59:1 (AA) · APCA Lc 45
Contrast pairs
代码片段
CSS
:root {
--razzle-dazzle-rose: #ff33cc;
--razzle-dazzle-rose-rgb: 255 51 204;
--razzle-dazzle-rose-oklch: oklch(0.69 0.271 340.9);
}
.element {
color: var(--razzle-dazzle-rose);
background-color: hsl(315 100% 60%);
border-color: oklch(0.69 0.271 340.9);
}Tailwind CSS v4
@theme {
--color-razzle-dazzle-rose: #ff33cc;
--color-razzle-dazzle-rose-50: #ffd6ff;
--color-razzle-dazzle-rose-100: #ffc3ff;
--color-razzle-dazzle-rose-200: #ffa2f3;
--color-razzle-dazzle-rose-300: #ff74db;
--color-razzle-dazzle-rose-400: #fe43cd;
--color-razzle-dazzle-rose-500: #ed00ba;
--color-razzle-dazzle-rose-600: #c8009d;
--color-razzle-dazzle-rose-700: #a1007e;
--color-razzle-dazzle-rose-800: #770060;
--color-razzle-dazzle-rose-900: #540044;
--color-razzle-dazzle-rose-950: #38002c;
}SCSS
$razzle-dazzle-rose: #ff33cc;
$razzle-dazzle-rose-rgb: 255, 51, 204;
$razzle-dazzle-rose-light: mix(#fff, $razzle-dazzle-rose, 20%);
$razzle-dazzle-rose-dark: mix(#000, $razzle-dazzle-rose, 20%);
.element {
color: $razzle-dazzle-rose;
box-shadow: 0 0 0 2px rgba($razzle-dazzle-rose, 0.35);
}