命名颜色 · #B6C0BC
Patina Grey
Patina Grey 即 #B6C0BC:rgb(182 192 188)、hsl(156 7% 73%)、oklch(0.799 0.012 170.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Patina Grey color name →
#B6C0BC
oklch(0.799 0.012 170.2)
颜色转换
- HEX
- #b6c0bc
- RGB
- rgb(182 192 188)
- HSL
- hsl(156 7% 73%)
- HWB
- hwb(156 71% 25%)
- OKLCH
- oklch(0.799 0.012 170.2)
- OKLab
- oklab(0.799 -0.012 0.002)
- CIE Lab
- lab(76.83 -4.14 0.76)
- LCH
- lch(76.83 4.21 169.6)
- CMYK
- cmyk(5% 0% 2% 25%)
浅色调 · 深色调 · 灰色调
浅色调
- BDC6C3
- C4CCC9
- CBD3D0
- D3D9D6
- DADFDD
- E1E5E4
- E9ECEB
- F0F2F1
- F8F9F8
深色调
- 9EA7A3
- 868E8B
- 6F7673
- 595F5D
- 444947
- 303432
- 1D201F
- 0C0E0D
- 020202
灰色调
- B0B9B6
- ABB3B0
- A5ACAA
- A0A6A3
- 9B9F9D
- 959997
- 909392
- 8B8C8C
- 858686
配色和谐
互补色 +180°
- B6C0BC
Patina Grey
- C4BABE
≈ Lilac Marble
类似色 -30° +30°
- B6C0BC
Patina Grey
- B9BFB8
≈ Solstice
- B5C0C0
≈ Flock of Seagulls
三角配色 +120° +240°
- B6C0BC
Patina Grey
- BDBCC5
≈ Silver Fox
- C4BBB6
≈ Mauve Stone
分裂互补色 +150° +210°
- B6C0BC
Patina Grey
- C1BBC2
≈ Lace Wisteria
- C5BABA
≈ Studio Mauve
四角配色 +90° +180° +270°
- B6C0BC
Patina Grey
- B9BEC5
≈ Blue to You
- C4BABE
≈ Lilac Marble
- C1BDB5
≈ Ooid Sand
对比度与无障碍
Ag
Fail白底
WCAG 1.86:1 · APCA Lc 35
Ag
AAA黑底
WCAG 11.25:1 · APCA Lc 67
最佳文字颜色: #000000
WCAG 11.25:1 (AAA) · APCA Lc 67
Contrast pairs
代码片段
CSS
:root {
--patina-grey: #b6c0bc;
--patina-grey-rgb: 182 192 188;
--patina-grey-oklch: oklch(0.799 0.012 170.2);
}
.element {
color: var(--patina-grey);
background-color: hsl(156 7% 73%);
border-color: oklch(0.799 0.012 170.2);
}Tailwind CSS v4
@theme {
--color-patina-grey: #b6c0bc;
--color-patina-grey-50: #f2f6f5;
--color-patina-grey-100: #e4e9e7;
--color-patina-grey-200: #cfd6d3;
--color-patina-grey-300: #b1b9b7;
--color-patina-grey-400: #98a19d;
--color-patina-grey-500: #7f8985;
--color-patina-grey-600: #6b7470;
--color-patina-grey-700: #565d5a;
--color-patina-grey-800: #3e4441;
--color-patina-grey-900: #2b2f2d;
--color-patina-grey-950: #181b1a;
}SCSS
$patina-grey: #b6c0bc;
$patina-grey-rgb: 182, 192, 188;
$patina-grey-light: mix(#fff, $patina-grey, 20%);
$patina-grey-dark: mix(#000, $patina-grey, 20%);
.element {
color: $patina-grey;
box-shadow: 0 0 0 2px rgba($patina-grey, 0.35);
}