Màu có tên · #FF33CC
Razzle Dazzle Rose
Razzle Dazzle Rose là #FF33CC: rgb(255 51 204), hsl(315 100% 60%), oklch(0.69 0.271 340.9). Xem sắc nhạt, sắc đậm, hòa sắc, tương phản WCAG và APCA, cùng mã CSS, Tailwind v4 và SCSS.
What does Pink mean? → · Razzle Dazzle Rose color name →
#FF33CC
oklch(0.69 0.271 340.9)
Chuyển đổi màu
- 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%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- FF54D2
- FF6CD7
- FF82DC
- FF95E1
- FFA8E7
- FFBAEC
- FFCCF1
- FFDDF6
- FFEEFA
Sắc đậm
- DE2BB1
- BE2397
- 9E1C7E
- 801465
- 630D4E
- 480737
- 2E0322
- 16010F
- 030002
Sắc xám
- F344C4
- E851BD
- DC5BB5
- D063AE
- C46AA6
- B7709F
- AA7597
- 9D798F
- 8F7D88
Hòa sắc
Bổ túc +180°
- FF33CC
Razzle Dazzle Rose
- 00B87B
≈ Green Teal
Tương đồng -30° +30°
- FF33CC
Razzle Dazzle Rose
- C768FF
≈ Jacaranda Pink
- FF567C
≈ Warm Pink
Bộ ba +120° +240°
- FF33CC
Razzle Dazzle Rose
- AF9D00
≈ Lucky
- 00ACD2
≈ Hú Lán Blue
Bổ túc chia +150° +210°
- FF33CC
Razzle Dazzle Rose
- 70B100
≈ Extra Life
- 00B2AD
≈ Laguna Green
Bộ bốn +90° +180° +270°
- FF33CC
Razzle Dazzle Rose
- D48900
≈ Fleur de Sel Caramel
- 00B87B
≈ Green Teal
- 3A9FFF
≈ Sky Dancer
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 3.18:1 · APCA Lc 57
Ag
AATrên nền đen
WCAG 6.59:1 · APCA Lc 45
Màu chữ tốt nhất: #000000
WCAG 6.59:1 (AA) · APCA Lc 45
Contrast pairs
Đoạn mã
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);
}