命名颜色 · #79B0B6
Buoyancy
Buoyancy 即 #79B0B6:rgb(121 176 182)、hsl(186 29% 59%)、oklch(0.721 0.058 204.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Cyan mean? → · Buoyancy color name →
#79B0B6
oklch(0.721 0.058 204.5)
颜色转换
- HEX
- #79b0b6
- RGB
- rgb(121 176 182)
- HSL
- hsl(186 29% 59%)
- HWB
- hwb(186 47% 29%)
- OKLCH
- oklch(0.721 0.058 204.5)
- OKLab
- oklab(0.721 -0.053 -0.024)
- CIE Lab
- lab(68.18 -17.57 -9.16)
- LCH
- lch(68.18 19.81 207.5)
- CMYK
- cmyk(34% 3% 0% 29%)
浅色调 · 深色调 · 灰色调
浅色调
- 87B8BD
- 94C0C4
- A2C7CC
- AFCFD3
- BCD7DA
- C9DFE1
- D7E7E9
- E4EFF0
- F2F7F8
深色调
- 68999E
- 588286
- 486C6F
- 395659
- 2B4244
- 1D2E30
- 101C1D
- 050B0C
- 010102
灰色调
- 7AABB0
- 7CA6AB
- 7DA1A6
- 7E9DA0
- 7E989B
- 7F9395
- 7F8E90
- 808A8B
- 808585
配色和谐
互补色 +180°
- 79B0B6
Buoyancy
- C79793
≈ Fall Canyon
类似色 -30° +30°
- 79B0B6
Buoyancy
- 7EB1A2
≈ Le Max
- 81ACC4
≈ Arabella
三角配色 +120° +240°
- 79B0B6
Buoyancy
- B899BA
≈ Grape Smoke
- B6A37B
≈ Sailor’s Knot
分裂互补色 +150° +210°
- 79B0B6
Buoyancy
- C396A7
≈ Light Mauve
- C29C83
≈ Chestnut Bisque
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 2.41:1 · APCA Lc 47
Ag
AAA黑底
WCAG 8.69:1 · APCA Lc 55
最佳文字颜色: #000000
WCAG 8.69:1 (AAA) · APCA Lc 55
Contrast pairs
代码片段
CSS
:root {
--buoyancy: #79b0b6;
--buoyancy-rgb: 121 176 182;
--buoyancy-oklch: oklch(0.721 0.058 204.5);
}
.element {
color: var(--buoyancy);
background-color: hsl(186 29% 59%);
border-color: oklch(0.721 0.058 204.5);
}Tailwind CSS v4
@theme {
--color-buoyancy: #79b0b6;
--color-buoyancy-50: #e3fafd;
--color-buoyancy-100: #d3eef2;
--color-buoyancy-200: #b9dce1;
--color-buoyancy-300: #95c0c6;
--color-buoyancy-400: #75a9ae;
--color-buoyancy-500: #559298;
--color-buoyancy-600: #487b81;
--color-buoyancy-700: #3a6367;
--color-buoyancy-800: #29484b;
--color-buoyancy-900: #1b3234;
--color-buoyancy-950: #0b1e20;
}SCSS
$buoyancy: #79b0b6;
$buoyancy-rgb: 121, 176, 182;
$buoyancy-light: mix(#fff, $buoyancy, 20%);
$buoyancy-dark: mix(#000, $buoyancy, 20%);
.element {
color: $buoyancy;
box-shadow: 0 0 0 2px rgba($buoyancy, 0.35);
}