命名颜色 · #FFBB8F

Fuzzy Peach

Fuzzy Peach 即 #FFBB8F：rgb(255 187 143)、hsl(24 100% 78%)、oklch(0.845 0.098 53.9)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

What does Orange mean? → · Fuzzy Peach color name →

#FFBB8F

oklch(0.845 0.098 53.9)

颜色转换

HEX: #ffbb8f
RGB: rgb(255 187 143)
HSL: hsl(24 100% 78%)
HWB: hwb(24 56% 0%)
OKLCH: oklch(0.845 0.098 53.9)
OKLab: oklab(0.845 0.058 0.079)
CIE Lab: lab(81.59 21.5 32.45)
LCH: lch(81.59 38.93 56.5)
CMYK: cmyk(0% 27% 44% 0%)

浅色调 · 深色调 · 灰色调

浅色调

FFC29A
FFC9A6
FFD0B1
FFD7BC
FFDDC7
FFE4D3
FFEBDE
FFF2E9
FFF8F4

深色调

DEA27C
BE8A69
9E7357
805C45
634634
483224
2E1F15
160D07
030201

灰色调

F2B58E
E5AF8D
D8A98C
CBA48A
BF9E89
B29887
A59286
998C84
8C8682

配色和谐

互补色 +180°

FFBB8F
Fuzzy Peach
8ED7FF
≈ Kul Sharif Blue

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

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

对比度与无障碍

白底

WCAG 1.64:1 · APCA Lc 29

Fail

黑底

WCAG 12.75:1 · APCA Lc 74

AAA

最佳文字颜色: #000000

WCAG 12.75:1 (AAA) · APCA Lc 74

Contrast pairs

代码片段

CSS

:root {
  --fuzzy-peach: #ffbb8f;
  --fuzzy-peach-rgb: 255 187 143;
  --fuzzy-peach-oklch: oklch(0.845 0.098 53.9);
}

.element {
  color: var(--fuzzy-peach);
  background-color: hsl(24 100% 78%);
  border-color: oklch(0.845 0.098 53.9);
}

Tailwind CSS v4

@theme {
  --color-fuzzy-peach: #ffbb8f;
  --color-fuzzy-peach-50: #ffefdb;
  --color-fuzzy-peach-100: #ffe0c9;
  --color-fuzzy-peach-200: #f6caad;
  --color-fuzzy-peach-300: #dfab87;
  --color-fuzzy-peach-400: #cc8e66;
  --color-fuzzy-peach-500: #b87343;
  --color-fuzzy-peach-600: #9c623a;
  --color-fuzzy-peach-700: #7d4e2e;
  --color-fuzzy-peach-800: #5d3821;
  --color-fuzzy-peach-900: #412616;
  --color-fuzzy-peach-950: #2a1407;
}

SCSS

$fuzzy-peach: #ffbb8f;
$fuzzy-peach-rgb: 255, 187, 143;
$fuzzy-peach-light: mix(#fff, $fuzzy-peach, 20%);
$fuzzy-peach-dark: mix(#000, $fuzzy-peach, 20%);

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

相近的命名颜色

Palettes with similar colors

在工具中打开

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