命名颜色 · #0A6F69
Tide Pools
Tide Pools 即 #0A6F69：rgb(10 111 105)、hsl(176 83% 24%)、oklch(0.489 0.083 188.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Teal mean? → · Tide Pools color name →
#0A6F69
oklch(0.489 0.083 188.2)
颜色转换
- HEX
- #0a6f69
- RGB
- rgb(10 111 105)
- HSL
- hsl(176 83% 24%)
- HWB
- hwb(176 4% 56%)
- OKLCH
- oklch(0.489 0.083 188.2)
- OKLab
- oklab(0.489 -0.082 -0.012)
- CIE Lab
- lab(41.72 -28.24 -4.58)
- LCH
- lch(41.72 28.61 189.2)
- CMYK
- cmyk(91% 0% 5% 56%)
浅色调 · 深色调 · 灰色调
浅色调
- 317D77
- 4B8B85
- 639993
- 79A7A2
- 8FB5B1
- A5C4C0
- BBD2D0
- D2E1DF
- E8F0EF
深色调
- 07605A
- 05514C
- 03423E
- 023431
- 012724
- 011A18
- 000E0C
- 000404
- 000100
灰色调
- 23716B
- 33736E
- 3F7570
- 4A7672
- 547874
- 5D7A77
- 667B79
- 6F7D7B
- 787F7E
配色和谐
互补色 +180°
- 0A6F69
Tide Pools
- 884B57
≈ Wine Not
类似色 -30° +30°
- 0A6F69
Tide Pools
- 316E4E
≈ Jungle Book Green
- 136B7F
≈ Porpoise Place
三角配色 +120° +240°
- 0A6F69
Tide Pools
- 6D5384
≈ Gutsy Grape
- 7F5727
≈ Hot Curry
分裂互补色 +150° +210°
- 0A6F69
Tide Pools
- 7F4D70
≈ Madder Magenta
- 884F3D
≈ Wiener Dog
四角配色 +90° +180° +270°
- 0A6F69
Tide Pools
- 555B8F
≈ Midnight Sea
- 884B57
≈ Wine Not
- 6D6022
≈ Hot Mustard
对比度与无障碍
Ag
AA白底
WCAG 6.01:1 · APCA Lc 80
Ag
Fail黑底
WCAG 3.49:1 · APCA Lc 22
最佳文字颜色: #FFFFFF
WCAG 6.01:1 (AA) · APCA Lc 80
Contrast pairs
代码片段
CSS
:root {
--tide-pools: #0a6f69;
--tide-pools-rgb: 10 111 105;
--tide-pools-oklch: oklch(0.489 0.083 188.2);
}
.element {
color: var(--tide-pools);
background-color: hsl(176 83% 24%);
border-color: oklch(0.489 0.083 188.2);
}Tailwind CSS v4
@theme {
--color-tide-pools: #0a6f69;
--color-tide-pools-50: #dbfdfa;
--color-tide-pools-100: #caf1ee;
--color-tide-pools-200: #ace0dc;
--color-tide-pools-300: #85c5c1;
--color-tide-pools-400: #60aea8;
--color-tide-pools-500: #359890;
--color-tide-pools-600: #2f807a;
--color-tide-pools-700: #256762;
--color-tide-pools-800: #1a4c47;
--color-tide-pools-900: #113531;
--color-tide-pools-950: #03201d;
}SCSS
$tide-pools: #0a6f69;
$tide-pools-rgb: 10, 111, 105;
$tide-pools-light: mix(#fff, $tide-pools, 20%);
$tide-pools-dark: mix(#000, $tide-pools, 20%);
.element {
color: $tide-pools;
box-shadow: 0 0 0 2px rgba($tide-pools, 0.35);
}