命名颜色 · #E8CCD7

Queen Pink

Queen Pink 即 #E8CCD7：rgb(232 204 215)、hsl(336 38% 85%)、oklch(0.872 0.034 352.1)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

What does Gray mean? → · Queen Pink color name →

#E8CCD7

oklch(0.872 0.034 352.1)

颜色转换

HEX: #e8ccd7
RGB: rgb(232 204 215)
HSL: hsl(336 38% 85%)
HWB: hwb(336 80% 9%)
OKLCH: oklch(0.872 0.034 352.1)
OKLab: oklab(0.872 0.034 -0.005)
CIE Lab: lab(84.67 11.49 -1.68)
LCH: lch(84.67 11.61 351.7)
CMYK: cmyk(0% 12% 7% 9%)

浅色调 · 深色调 · 灰色调

浅色调

EAD1DB
EDD6DF
EFDBE3
F1E0E7
F4E5EB
F6EAEF
F8F0F3
FBF5F7
FDFAFB

深色调

CAB1BB
AC979F
907E85
74656B
594E52
40373B
292225
130F11
030202

灰色调

DDC4CE
D2BCC5
C8B5BC
BDADB3
B3A5AA
A89EA2
9E9699
948F91
8A8788

配色和谐

互补色 +180°

E8CCD7
Queen Pink
BFDDD2
≈ Tierra Del Fuego Sea Green

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

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

对比度与无障碍

白底

WCAG 1.49:1 · APCA Lc 23

Fail

黑底

WCAG 14.04:1 · APCA Lc 80

AAA

最佳文字颜色: #000000

WCAG 14.04:1 (AAA) · APCA Lc 80

Contrast pairs

代码片段

CSS

:root {
  --queen-pink: #e8ccd7;
  --queen-pink-rgb: 232 204 215;
  --queen-pink-oklch: oklch(0.872 0.034 352.1);
}

.element {
  color: var(--queen-pink);
  background-color: hsl(336 38% 85%);
  border-color: oklch(0.872 0.034 352.1);
}

Tailwind CSS v4

@theme {
  --color-queen-pink: #e8ccd7;
  --color-queen-pink-50: #fef1f6;
  --color-queen-pink-100: #f2e3e8;
  --color-queen-pink-200: #e1ced5;
  --color-queen-pink-300: #c7b0b8;
  --color-queen-pink-400: #b096a0;
  --color-queen-pink-500: #997d88;
  --color-queen-pink-600: #816a73;
  --color-queen-pink-700: #68555c;
  --color-queen-pink-800: #4c3e44;
  --color-queen-pink-900: #352a2f;
  --color-queen-pink-950: #20181b;
}

SCSS

$queen-pink: #e8ccd7;
$queen-pink-rgb: 232, 204, 215;
$queen-pink-light: mix(#fff, $queen-pink, 20%);
$queen-pink-dark: mix(#000, $queen-pink, 20%);

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

相近的命名颜色

Palettes with similar colors

在工具中打开

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