命名颜色 · #FFEFF3

Powder Puff

Powder Puff 即 #FFEFF3：rgb(255 239 243)、hsl(345 100% 97%)、oklch(0.966 0.018 0.4)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

What does Gray mean? → · Powder Puff color name →

#FFEFF3

oklch(0.966 0.018 0.4)

颜色转换

HEX: #ffeff3
RGB: rgb(255 239 243)
HSL: hsl(345 100% 97%)
HWB: hwb(345 94% 0%)
OKLCH: oklch(0.966 0.018 0.4)
OKLab: oklab(0.966 0.018 0)
CIE Lab: lab(95.81 6.08 0.11)
LCH: lch(95.81 6.08 1)
CMYK: cmyk(0% 6% 5% 0%)

浅色调 · 深色调 · 灰色调

浅色调

FFF1F4
FFF2F5
FFF4F7
FFF5F8
FFF7F9
FFF9FA
FFFAFB
FFFCFD
FFFDFE

深色调

DED0D3
BEB1B4
9E9497
80787A
635C5E
484244
2E2A2B
161414
030303

灰色调

F2E3E7
E4D8DB
D7CCCF
CAC1C3
BEB6B8
B1ABAC
A4A0A1
989596
8C8B8B

配色和谐

互补色 +180°

FFEFF3
Powder Puff
E8F8F4
≈ Melting Glacier

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

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

对比度与无障碍

白底

WCAG 1.11:1 · APCA Lc 0

Fail

黑底

WCAG 18.89:1 · APCA Lc 100

AAA

最佳文字颜色: #000000

WCAG 18.89:1 (AAA) · APCA Lc 100

Contrast pairs

代码片段

CSS

:root {
  --powder-puff: #ffeff3;
  --powder-puff-rgb: 255 239 243;
  --powder-puff-oklch: oklch(0.966 0.018 0.4);
}

.element {
  color: var(--powder-puff);
  background-color: hsl(345 100% 97%);
  border-color: oklch(0.966 0.018 0.4);
}

Tailwind CSS v4

@theme {
  --color-powder-puff: #ffeff3;
  --color-powder-puff-50: #faf3f5;
  --color-powder-puff-100: #ede5e7;
  --color-powder-puff-200: #dbd1d3;
  --color-powder-puff-300: #c0b4b6;
  --color-powder-puff-400: #a89a9e;
  --color-powder-puff-500: #918185;
  --color-powder-puff-600: #7b6e71;
  --color-powder-puff-700: #62585a;
  --color-powder-puff-800: #484042;
  --color-powder-puff-900: #322c2e;
  --color-powder-puff-950: #1e191a;
}

SCSS

$powder-puff: #ffeff3;
$powder-puff-rgb: 255, 239, 243;
$powder-puff-light: mix(#fff, $powder-puff, 20%);
$powder-puff-dark: mix(#000, $powder-puff, 20%);

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

相近的命名颜色

Palettes with similar colors

在工具中打开

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