命名颜色 · #C6CACA

Grey Screen

Grey Screen 即 #C6CACA：rgb(198 202 202)、hsl(180 4% 78%)、oklch(0.836 0.004 197.1)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

What does Gray mean? → · Grey Screen color name →

#C6CACA

oklch(0.836 0.004 197.1)

颜色转换

HEX: #c6caca
RGB: rgb(198 202 202)
HSL: hsl(180 4% 78%)
HWB: hwb(180 78% 21%)
OKLCH: oklch(0.836 0.004 197.1)
OKLab: oklab(0.836 -0.004 -0.001)
CIE Lab: lab(81.01 -1.42 -0.51)
LCH: lch(81.01 1.51 199.6)
CMYK: cmyk(2% 0% 0% 21%)

浅色调 · 深色调 · 灰色调

浅色调

CCCFCF
D1D4D4
D7DADA
DCDFDF
E2E4E4
E8EAEA
EEEFEF
F3F4F4
F9FAFA

深色调

ACAFAF
929595
7A7C7C
626464
4B4D4D
353737
212222
0E0F0F
020202

灰色调

BFC2C2
B8BBBB
B0B3B3
A9ACAC
A2A4A4
9B9D9D
949696
8E8E8E
878787

配色和谐

互补色 +180°

C6CACA
Grey Screen
CCC8C8
≈ Unique Grey

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

四角配色 +90° +180° +270°

对比度与无障碍

白底

WCAG 1.65:1 · APCA Lc 29

Fail

黑底

WCAG 12.70:1 · APCA Lc 74

AAA

最佳文字颜色: #000000

WCAG 12.70:1 (AAA) · APCA Lc 74

Contrast pairs

代码片段

CSS

:root {
  --grey-screen: #c6caca;
  --grey-screen-rgb: 198 202 202;
  --grey-screen-oklch: oklch(0.836 0.004 197.1);
}

.element {
  color: var(--grey-screen);
  background-color: hsl(180 4% 78%);
  border-color: oklch(0.836 0.004 197.1);
}

Tailwind CSS v4

@theme {
  --color-grey-screen: #c6caca;
  --color-grey-screen-50: #f4f5f5;
  --color-grey-screen-100: #e6e8e8;
  --color-grey-screen-200: #d2d5d5;
  --color-grey-screen-300: #b5b8b8;
  --color-grey-screen-400: #9c9f9f;
  --color-grey-screen-500: #838787;
  --color-grey-screen-600: #6f7272;
  --color-grey-screen-700: #595b5b;
  --color-grey-screen-800: #414343;
  --color-grey-screen-900: #2d2e2e;
  --color-grey-screen-950: #1a1b1b;
}

SCSS

$grey-screen: #c6caca;
$grey-screen-rgb: 198, 202, 202;
$grey-screen-light: mix(#fff, $grey-screen, 20%);
$grey-screen-dark: mix(#000, $grey-screen, 20%);

.element {
  color: $grey-screen;
  box-shadow: 0 0 0 2px rgba($grey-screen, 0.35);
}

相近的命名颜色

Palettes with similar colors

在工具中打开

取色器配色组合对比度检测 Studio JSON API