命名颜色 · #7A999C
Cathedral Glass
Cathedral Glass 即 #7A999C:rgb(122 153 156)、hsl(185 15% 55%)、oklch(0.661 0.035 203.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Cathedral Glass color name →
#7A999C
oklch(0.661 0.035 203.6)
颜色转换
- HEX
- #7a999c
- RGB
- rgb(122 153 156)
- HSL
- hsl(185 15% 55%)
- HWB
- hwb(185 48% 39%)
- OKLCH
- oklch(0.661 0.035 203.6)
- OKLab
- oklab(0.661 -0.032 -0.014)
- CIE Lab
- lab(60.94 -10.66 -5.34)
- LCH
- lch(60.94 11.92 206.6)
- CMYK
- cmyk(22% 2% 0% 39%)
浅色调 · 深色调 · 灰色调
浅色调
- 87A3A5
- 94ADAF
- A1B7B9
- AEC1C3
- BBCBCC
- C8D5D6
- D6E0E0
- E3EAEB
- F1F4F5
深色调
- 698487
- 597073
- 495D5F
- 3A4A4C
- 2B3839
- 1D2728
- 101718
- 050809
- 010101
灰色调
- 7B9699
- 7C9496
- 7C9194
- 7D8F91
- 7E8C8E
- 7E8A8B
- 7F8788
- 7F8586
- 808283
配色和谐
互补色 +180°
- 7A999C
Cathedral Glass
- A78B88
≈ Delicate Brown
类似色 -30° +30°
- 7A999C
Cathedral Glass
- 7D9A90
≈ Secluded Garden
- 7E96A5
≈ Storm Petrel
三角配色 +120° +240°
- 7A999C
Cathedral Glass
- 9D8C9F
≈ Berry Cream
- 9D917B
≈ Flannel
分裂互补色 +150° +210°
- 7A999C
Cathedral Glass
- A48A94
≈ Gothic Amethyst
- A48D7F
≈ Stucco
四角配色 +90° +180° +270°
- 7A999C
Cathedral Glass
- 938FA6
≈ Orchilla
- A78B88
≈ Delicate Brown
- 92957D
≈ Swamp Sessions
对比度与无障碍
Ag
Fail白底
WCAG 3.05:1 · APCA Lc 57
Ag
AA黑底
WCAG 6.86:1 · APCA Lc 44
最佳文字颜色: #000000
WCAG 6.86:1 (AA) · APCA Lc 44
Contrast pairs
代码片段
CSS
:root {
--cathedral-glass: #7a999c;
--cathedral-glass-rgb: 122 153 156;
--cathedral-glass-oklch: oklch(0.661 0.035 203.6);
}
.element {
color: var(--cathedral-glass);
background-color: hsl(185 15% 55%);
border-color: oklch(0.661 0.035 203.6);
}Tailwind CSS v4
@theme {
--color-cathedral-glass: #7a999c;
--color-cathedral-glass-50: #eaf8fa;
--color-cathedral-glass-100: #dbebed;
--color-cathedral-glass-200: #c4d9db;
--color-cathedral-glass-300: #a4bdc0;
--color-cathedral-glass-400: #87a5a8;
--color-cathedral-glass-500: #6b8d91;
--color-cathedral-glass-600: #5b787a;
--color-cathedral-glass-700: #496062;
--color-cathedral-glass-800: #344647;
--color-cathedral-glass-900: #243131;
--color-cathedral-glass-950: #121d1d;
}SCSS
$cathedral-glass: #7a999c;
$cathedral-glass-rgb: 122, 153, 156;
$cathedral-glass-light: mix(#fff, $cathedral-glass, 20%);
$cathedral-glass-dark: mix(#000, $cathedral-glass, 20%);
.element {
color: $cathedral-glass;
box-shadow: 0 0 0 2px rgba($cathedral-glass, 0.35);
}