命名颜色 · #9CB0B3
Aqua-Sphere
Aqua-Sphere 即 #9CB0B3:rgb(156 176 179)、hsl(188 13% 66%)、oklch(0.743 0.023 207.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Aqua-Sphere color name →
#9CB0B3
oklch(0.743 0.023 207.6)
颜色转换
- HEX
- #9cb0b3
- RGB
- rgb(156 176 179)
- HSL
- hsl(188 13% 66%)
- HWB
- hwb(188 61% 30%)
- OKLCH
- oklch(0.743 0.023 207.6)
- OKLab
- oklab(0.743 -0.02 -0.01)
- CIE Lab
- lab(70.35 -6.71 -4.02)
- LCH
- lch(70.35 7.82 210.9)
- CMYK
- cmyk(13% 2% 0% 30%)
浅色调 · 深色调 · 灰色调
浅色调
- A6B8BA
- AFBFC2
- B9C7C9
- C3CFD1
- CDD7D8
- D7DFE0
- E1E7E8
- EBEFEF
- F5F7F7
深色调
- 87999B
- 738284
- 5F6C6E
- 4C5658
- 394243
- 282E2F
- 181C1D
- 090B0C
- 010101
灰色调
- 99ABAE
- 96A6A9
- 94A1A3
- 919D9E
- 8E9899
- 8B9394
- 888E8F
- 86898A
- 838585
配色和谐
互补色 +180°
- 9CB0B3
Aqua-Sphere
- BAA7A4
≈ Martini
类似色 -30° +30°
- 9CB0B3
Aqua-Sphere
- 9DB1AB
≈ Garden Vista
- 9FAEB9
≈ How Handsome
三角配色 +120° +240°
- 9CB0B3
Aqua-Sphere
- B4A7B3
≈ Resplendent
- B2AB9C
≈ Terrace Taupe
分裂互补色 +150° +210°
- 9CB0B3
Aqua-Sphere
- B8A6AC
≈ Foggy Plum
- B7A89E
≈ Prestige
四角配色 +90° +180° +270°
- 9CB0B3
Aqua-Sphere
- ADA9B9
≈ Morning Mist Grey
- BAA7A4
≈ Martini
- AAAE9E
≈ Mountain Lichen
对比度与无障碍
Ag
Fail白底
WCAG 2.26:1 · APCA Lc 45
Ag
AAA黑底
WCAG 9.27:1 · APCA Lc 57
最佳文字颜色: #000000
WCAG 9.27:1 (AAA) · APCA Lc 57
Contrast pairs
代码片段
CSS
:root {
--aqua-sphere: #9cb0b3;
--aqua-sphere-rgb: 156 176 179;
--aqua-sphere-oklch: oklch(0.743 0.023 207.6);
}
.element {
color: var(--aqua-sphere);
background-color: hsl(188 13% 66%);
border-color: oklch(0.743 0.023 207.6);
}Tailwind CSS v4
@theme {
--color-aqua-sphere: #9cb0b3;
--color-aqua-sphere-50: #eef7f9;
--color-aqua-sphere-100: #e0eaec;
--color-aqua-sphere-200: #cad7d9;
--color-aqua-sphere-300: #abbbbe;
--color-aqua-sphere-400: #90a2a5;
--color-aqua-sphere-500: #758b8e;
--color-aqua-sphere-600: #647578;
--color-aqua-sphere-700: #4f5e60;
--color-aqua-sphere-800: #3a4546;
--color-aqua-sphere-900: #273031;
--color-aqua-sphere-950: #161c1d;
}SCSS
$aqua-sphere: #9cb0b3;
$aqua-sphere-rgb: 156, 176, 179;
$aqua-sphere-light: mix(#fff, $aqua-sphere, 20%);
$aqua-sphere-dark: mix(#000, $aqua-sphere, 20%);
.element {
color: $aqua-sphere;
box-shadow: 0 0 0 2px rgba($aqua-sphere, 0.35);
}