命名颜色 · #00FFCC
Plunge Pool
Plunge Pool 即 #00FFCC：rgb(0 255 204)、hsl(168 100% 50%)、oklch(0.89 0.174 171.3)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Teal mean? → · Plunge Pool color name →
#00FFCC
oklch(0.89 0.174 171.3)
颜色转换
- HEX
- #00ffcc
- RGB
- rgb(0 255 204)
- HSL
- hsl(168 100% 50%)
- HWB
- hwb(168 0% 0%)
- OKLCH
- oklch(0.89 0.174 171.3)
- OKLab
- oklab(0.89 -0.172 0.026)
- CIE Lab
- lab(89.56 -61.06 9.62)
- LCH
- lch(89.56 61.82 171.1)
- CMYK
- cmyk(100% 0% 20% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- 4FFFD1
- 6FFFD6
- 88FFDB
- 9DFFE0
- B0FFE5
- C2FFEA
- D2FFF0
- E2FFF5
- F1FFFA
深色调
- 00DEB1
- 00BE97
- 009E7E
- 008065
- 00634E
- 004837
- 002E22
- 00160F
- 000302
灰色调
- 3AF2C4
- 50E5BC
- 5ED8B5
- 68CBAD
- 70BFA5
- 75B29E
- 7AA596
- 7D998F
- 7F8C87
配色和谐
互补色 +180°
- 00FFCC
Plunge Pool
- FFC9E0
≈ Cherry Blush
类似色 -30° +30°
- 00FFCC
Plunge Pool
- 95F787
≈ Radar Blip Green
- 52F5FF
≈ Frozen Turquoise
三角配色 +120° +240°
- 00FFCC
Plunge Pool
- DAD5FF
≈ Pale Lavender
- FFCFB4
≈ Apricot Lily
分裂互补色 +150° +210°
- 00FFCC
Plunge Pool
- F7C8FF
≈ Aquarelle Lilac
- FFCDCA
≈ Aromatic Breeze
四角配色 +90° +180° +270°
- 00FFCC
Plunge Pool
- C7DCFF
≈ Arc Light
- FFC9E0
≈ Cherry Blush
- FFD487
≈ Oberon
对比度与无障碍
Ag
Fail白底
WCAG 1.29:1 · APCA Lc 14
Ag
AAA黑底
WCAG 16.17:1 · APCA Lc 90
最佳文字颜色: #000000
WCAG 16.17:1 (AAA) · APCA Lc 90
Contrast pairs
代码片段
CSS
:root {
--plunge-pool: #00ffcc;
--plunge-pool-rgb: 0 255 204;
--plunge-pool-oklch: oklch(0.89 0.174 171.3);
}
.element {
color: var(--plunge-pool);
background-color: hsl(168 100% 50%);
border-color: oklch(0.89 0.174 171.3);
}Tailwind CSS v4
@theme {
--color-plunge-pool: #00ffcc;
--color-plunge-pool-50: #c2fff1;
--color-plunge-pool-100: #aafbe3;
--color-plunge-pool-200: #7dedce;
--color-plunge-pool-300: #31d4af;
--color-plunge-pool-400: #00be91;
--color-plunge-pool-500: #00a877;
--color-plunge-pool-600: #008e65;
--color-plunge-pool-700: #007250;
--color-plunge-pool-800: #005438;
--color-plunge-pool-900: #003b26;
--color-plunge-pool-950: #002415;
}SCSS
$plunge-pool: #00ffcc;
$plunge-pool-rgb: 0, 255, 204;
$plunge-pool-light: mix(#fff, $plunge-pool, 20%);
$plunge-pool-dark: mix(#000, $plunge-pool, 20%);
.element {
color: $plunge-pool;
box-shadow: 0 0 0 2px rgba($plunge-pool, 0.35);
}