命名颜色 · #DD00EE
Piercing Pink
Piercing Pink 即 #DD00EE：rgb(221 0 238)、hsl(296 100% 47%)、oklch(0.64 0.3 324.4)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Purple mean? → · Piercing Pink color name →
#DD00EE
oklch(0.64 0.3 324.4)
颜色转换
- HEX
- #dd00ee
- RGB
- rgb(221 0 238)
- HSL
- hsl(296 100% 47%)
- HWB
- hwb(296 0% 7%)
- OKLCH
- oklch(0.64 0.3 324.4)
- OKLab
- oklab(0.64 0.244 -0.175)
- CIE Lab
- lab(53.24 85.77 -62.5)
- LCH
- lch(53.24 106.13 323.9)
- CMYK
- cmyk(7% 100% 0% 7%)
浅色调 · 深色调 · 灰色调
浅色调
- E240F1
- E85EF4
- EC77F6
- F08CF8
- F4A1FA
- F7B5FC
- FAC8FD
- FCDAFE
- FEEDFF
深色调
- C000CF
- A400B1
- 880093
- 6E0077
- 55005C
- 3D0042
- 26002A
- 110014
- 020003
灰色调
- D52EE3
- CC42D9
- C34FCE
- BB5AC3
- B263B8
- A86AAD
- 9F71A2
- 957797
- 8B7C8C
配色和谐
互补色 +180°
- DD00EE
Piercing Pink
- 00AA27
≈ Kobra Khan
类似色 -30° +30°
- DD00EE
Piercing Pink
- 9867FF
≈ Purple Anemone
- F80096
≈ Neon Pink
三角配色 +120° +240°
- DD00EE
Piercing Pink
- B18400
≈ Chestnut Gold
- 009FAB
≈ Riviera
分裂互补色 +150° +210°
- DD00EE
Piercing Pink
- 8B9500
≈ Snakes in the Grass
- 00A487
≈ Congo Green
四角配色 +90° +180° +270°
- DD00EE
Piercing Pink
- D46C00
≈ Marmalade
- 00AA27
≈ Kobra Khan
- 0098D1
≈ Blithe
对比度与无障碍
Ag
Fail白底
WCAG 3.95:1 · APCA Lc 64
Ag
AA黑底
WCAG 5.30:1 · APCA Lc 37
最佳文字颜色: #000000
WCAG 5.30:1 (AA) · APCA Lc 37
Contrast pairs
代码片段
CSS
:root {
--piercing-pink: #dd00ee;
--piercing-pink-rgb: 221 0 238;
--piercing-pink-oklch: oklch(0.64 0.3 324.4);
}
.element {
color: var(--piercing-pink);
background-color: hsl(296 100% 47%);
border-color: oklch(0.64 0.3 324.4);
}Tailwind CSS v4
@theme {
--color-piercing-pink: #dd00ee;
--color-piercing-pink-50: #ffd7ff;
--color-piercing-pink-100: #ffc4ff;
--color-piercing-pink-200: #ffa2ff;
--color-piercing-pink-300: #ff74ff;
--color-piercing-pink-400: #ee40fe;
--color-piercing-pink-500: #dd00f0;
--color-piercing-pink-600: #ba00cb;
--color-piercing-pink-700: #9600a3;
--color-piercing-pink-800: #6e007d;
--color-piercing-pink-900: #4e0058;
--color-piercing-pink-950: #33003c;
}SCSS
$piercing-pink: #dd00ee;
$piercing-pink-rgb: 221, 0, 238;
$piercing-pink-light: mix(#fff, $piercing-pink, 20%);
$piercing-pink-dark: mix(#000, $piercing-pink, 20%);
.element {
color: $piercing-pink;
box-shadow: 0 0 0 2px rgba($piercing-pink, 0.35);
}