命名颜色 · #E4E4E7

Lilac Mist

Lilac Mist 即 #E4E4E7：rgb(228 228 231)、hsl(240 6% 90%)、oklch(0.92 0.004 286.3)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

What does Gray mean? → · Lilac Mist color name →

#E4E4E7

oklch(0.92 0.004 286.3)

颜色转换

HEX: #e4e4e7
RGB: rgb(228 228 231)
HSL: hsl(240 6% 90%)
HWB: hwb(240 89% 9%)
OKLCH: oklch(0.92 0.004 286.3)
OKLab: oklab(0.92 0.001 -0.004)
CIE Lab: lab(90.65 0.4 -1.47)
LCH: lch(90.65 1.52 285.4)
CMYK: cmyk(1% 1% 0% 9%)

浅色调 · 深色调 · 灰色调

浅色调

E7E7E9
E9E9EC
ECECEE
EFEFF1
F1F1F3
F4F4F5
F7F7F8
FAFAFA
FCFCFD

深色调

C6C6C9
A9A9AB
8D8D8F
727273
585859
3F3F40
282828
121213
030303

灰色调

DADADC
CFCFD2
C5C5C7
BBBBBC
B1B1B2
A7A7A8
9D9D9E
939394
8A8A8A

配色和谐

互补色 +180°

E4E4E7
Lilac Mist
E5E5E2
≈ Apollo Landing

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

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

对比度与无障碍

白底

WCAG 1.26:1 · APCA Lc 13

Fail

黑底

WCAG 16.55:1 · APCA Lc 91

AAA

最佳文字颜色: #000000

WCAG 16.55:1 (AAA) · APCA Lc 91

Contrast pairs

代码片段

CSS

:root {
  --lilac-mist: #e4e4e7;
  --lilac-mist-rgb: 228 228 231;
  --lilac-mist-oklch: oklch(0.92 0.004 286.3);
}

.element {
  color: var(--lilac-mist);
  background-color: hsl(240 6% 90%);
  border-color: oklch(0.92 0.004 286.3);
}

Tailwind CSS v4

@theme {
  --color-lilac-mist: #e4e4e7;
  --color-lilac-mist-50: #f5f5f6;
  --color-lilac-mist-100: #e8e8e9;
  --color-lilac-mist-200: #d4d4d6;
  --color-lilac-mist-300: #b7b7b9;
  --color-lilac-mist-400: #9e9ea1;
  --color-lilac-mist-500: #868689;
  --color-lilac-mist-600: #717174;
  --color-lilac-mist-700: #5a5a5d;
  --color-lilac-mist-800: #424244;
  --color-lilac-mist-900: #2e2e2f;
  --color-lilac-mist-950: #1a1a1b;
}

SCSS

$lilac-mist: #e4e4e7;
$lilac-mist-rgb: 228, 228, 231;
$lilac-mist-light: mix(#fff, $lilac-mist, 20%);
$lilac-mist-dark: mix(#000, $lilac-mist, 20%);

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

相近的命名颜色

Palettes with similar colors

在工具中打开

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