命名颜色 · #BDBEBF

Rough Asphalt

Rough Asphalt 即 #BDBEBF：rgb(189 190 191)、hsl(210 2% 75%)、oklch(0.801 0.002 247.8)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

What does Gray mean? → · Rough Asphalt color name →

#BDBEBF

oklch(0.801 0.002 247.8)

颜色转换

HEX: #bdbebf
RGB: rgb(189 190 191)
HSL: hsl(210 2% 75%)
HWB: hwb(210 74% 25%)
OKLCH: oklch(0.801 0.002 247.8)
OKLab: oklab(0.801 -0.001 -0.002)
CIE Lab: lab(76.92 -0.22 -0.63)
LCH: lch(76.92 0.67 250.7)
CMYK: cmyk(1% 1% 0% 25%)

浅色调 · 深色调 · 灰色调

浅色调

C3C4C5
CACBCC
D0D1D2
D7D8D8
DEDEDF
E4E5E5
EBEBEB
F2F2F2
F8F8F8

深色调

A4A5A6
8C8C8D
747575
5D5E5E
474848
333333
1F1F1F
0D0D0D
020202

灰色调

B7B8B8
B0B1B2
AAABAC
A4A5A5
9E9E9F
989899
929292
8C8C8C
868686

配色和谐

互补色 +180°

BDBEBF
Rough Asphalt
BFBEBD
≈ Tin Soldier

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

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

对比度与无障碍

白底

WCAG 1.86:1 · APCA Lc 35

Fail

黑底

WCAG 11.28:1 · APCA Lc 67

AAA

最佳文字颜色: #000000

WCAG 11.28:1 (AAA) · APCA Lc 67

Contrast pairs

代码片段

CSS

:root {
  --rough-asphalt: #bdbebf;
  --rough-asphalt-rgb: 189 190 191;
  --rough-asphalt-oklch: oklch(0.801 0.002 247.8);
}

.element {
  color: var(--rough-asphalt);
  background-color: hsl(210 2% 75%);
  border-color: oklch(0.801 0.002 247.8);
}

Tailwind CSS v4

@theme {
  --color-rough-asphalt: #bdbebf;
  --color-rough-asphalt-50: #f5f5f5;
  --color-rough-asphalt-100: #e7e8e8;
  --color-rough-asphalt-200: #d3d4d5;
  --color-rough-asphalt-300: #b7b7b8;
  --color-rough-asphalt-400: #9d9e9f;
  --color-rough-asphalt-500: #858687;
  --color-rough-asphalt-600: #717272;
  --color-rough-asphalt-700: #5a5b5b;
  --color-rough-asphalt-800: #424243;
  --color-rough-asphalt-900: #2d2e2e;
  --color-rough-asphalt-950: #1a1b1b;
}

SCSS

$rough-asphalt: #bdbebf;
$rough-asphalt-rgb: 189, 190, 191;
$rough-asphalt-light: mix(#fff, $rough-asphalt, 20%);
$rough-asphalt-dark: mix(#000, $rough-asphalt, 20%);

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

相近的命名颜色

Palettes with similar colors

在工具中打开

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