命名颜色 · #CCFFFF
Dawn Departs
Dawn Departs 即 #CCFFFF:rgb(204 255 255)、hsl(180 100% 90%)、oklch(0.965 0.052 196.3)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Teal mean? → · Dawn Departs color name →
#CCFFFF
oklch(0.965 0.052 196.3)
颜色转换
- HEX
- #ccffff
- RGB
- rgb(204 255 255)
- HSL
- hsl(180 100% 90%)
- HWB
- hwb(180 80% 0%)
- OKLCH
- oklch(0.965 0.052 196.3)
- OKLab
- oklab(0.965 -0.049 -0.015)
- CIE Lab
- lab(96.49 -16.7 -5.61)
- LCH
- lch(96.49 17.62 198.6)
- CMYK
- cmyk(20% 0% 0% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- D1FFFF
- D7FFFF
- DCFFFF
- E1FFFF
- E6FFFF
- EBFFFF
- F0FFFF
- F5FFFF
- FAFFFF
深色调
- B1DEDE
- 97BEBE
- 7E9E9E
- 658080
- 4E6363
- 374848
- 222E2E
- 0F1616
- 020303
灰色调
- C4F2F2
- BDE4E4
- B5D7D7
- AECACA
- A6BEBE
- 9EB1B1
- 97A4A4
- 8F9898
- 888C8C
配色和谐
互补色 +180°
- CCFFFF
Dawn Departs
- FFEFEF
≈ White Gloss
类似色 -30° +30°
- CCFFFF
Dawn Departs
- D5FFEC
≈ Crystal Glass
- E5F7FF
≈ Clear Skies
三角配色 +120° +240°
- CCFFFF
Dawn Departs
- FAEFFF
≈ Lovely Euphoric Delight
- FFF1DE
≈ Candy Floss Cupcake
分裂互补色 +150° +210°
- CCFFFF
Dawn Departs
- FFEEF6
≈ Partial Pink
- FFF0E9
≈ Strawberry Dust
四角配色 +90° +180° +270°
- CCFFFF
Dawn Departs
- F2F2FF
≈ Cloud Break
- FFEFEF
≈ White Gloss
- F7F6CF
≈ Sunny Mimosa
对比度与无障碍
Ag
Fail白底
WCAG 1.08:1 · APCA Lc 0
Ag
AAA黑底
WCAG 19.31:1 · APCA Lc 102
最佳文字颜色: #000000
WCAG 19.31:1 (AAA) · APCA Lc 102
Contrast pairs
代码片段
CSS
:root {
--dawn-departs: #ccffff;
--dawn-departs-rgb: 204 255 255;
--dawn-departs-oklch: oklch(0.965 0.052 196.3);
}
.element {
color: var(--dawn-departs);
background-color: hsl(180 100% 90%);
border-color: oklch(0.965 0.052 196.3);
}Tailwind CSS v4
@theme {
--color-dawn-departs: #ccffff;
--color-dawn-departs-50: #e5fafa;
--color-dawn-departs-100: #d5eeee;
--color-dawn-departs-200: #bcdbdc;
--color-dawn-departs-300: #99c0c1;
--color-dawn-departs-400: #7ba8a8;
--color-dawn-departs-500: #5c9191;
--color-dawn-departs-600: #4e7b7b;
--color-dawn-departs-700: #3e6262;
--color-dawn-departs-800: #2c4848;
--color-dawn-departs-900: #1e3232;
--color-dawn-departs-950: #0e1e1e;
}SCSS
$dawn-departs: #ccffff;
$dawn-departs-rgb: 204, 255, 255;
$dawn-departs-light: mix(#fff, $dawn-departs, 20%);
$dawn-departs-dark: mix(#000, $dawn-departs, 20%);
.element {
color: $dawn-departs;
box-shadow: 0 0 0 2px rgba($dawn-departs, 0.35);
}