命名颜色 · #BBC9B2

Topiary Tint

Topiary Tint 即 #BBC9B2：rgb(187 201 178)、hsl(97 18% 74%)、oklch(0.819 0.035 133)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

What does Green mean? → · Topiary Tint color name →

#BBC9B2

oklch(0.819 0.035 133)

颜色转换

HEX: #bbc9b2
RGB: rgb(187 201 178)
HSL: hsl(97 18% 74%)
HWB: hwb(97 70% 21%)
OKLCH: oklch(0.819 0.035 133)
OKLab: oklab(0.819 -0.024 0.026)
CIE Lab: lab(79.4 -8.09 9.83)
LCH: lch(79.4 12.73 129.5)
CMYK: cmyk(7% 0% 11% 21%)

浅色调 · 深色调 · 灰色调

浅色调

C2CEBA
C8D4C1
CFD9C9
D6DED0
DDE4D8
E3E9E0
EAEFE7
F1F4EF
F8FAF7

深色调

A2AE9A
8A9583
737C6D
5C6457
464C43
32362F
1F221D
0D0F0C
020201

灰色调

B5C1AD
AFBAA8
A9B3A3
A3AB9E
9DA499
979D94
91958F
8B8E8A
868785

配色和谐

互补色 +180°

BBC9B2
Topiary Tint
CCBED4
≈ Playful Petal

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

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

对比度与无障碍

白底

WCAG 1.73:1 · APCA Lc 31

Fail

黑底

WCAG 12.11:1 · APCA Lc 71

AAA

最佳文字颜色: #000000

WCAG 12.11:1 (AAA) · APCA Lc 71

Contrast pairs

代码片段

CSS

:root {
  --topiary-tint: #bbc9b2;
  --topiary-tint-rgb: 187 201 178;
  --topiary-tint-oklch: oklch(0.819 0.035 133);
}

.element {
  color: var(--topiary-tint);
  background-color: hsl(97 18% 74%);
  border-color: oklch(0.819 0.035 133);
}

Tailwind CSS v4

@theme {
  --color-topiary-tint: #bbc9b2;
  --color-topiary-tint-50: #f1f8ee;
  --color-topiary-tint-100: #e3ebdf;
  --color-topiary-tint-200: #ced8c9;
  --color-topiary-tint-300: #b0bcaa;
  --color-topiary-tint-400: #96a38e;
  --color-topiary-tint-500: #7d8c74;
  --color-topiary-tint-600: #6a7662;
  --color-topiary-tint-700: #555e4e;
  --color-topiary-tint-800: #3e4538;
  --color-topiary-tint-900: #2b3027;
  --color-topiary-tint-950: #181c15;
}

SCSS

$topiary-tint: #bbc9b2;
$topiary-tint-rgb: 187, 201, 178;
$topiary-tint-light: mix(#fff, $topiary-tint, 20%);
$topiary-tint-dark: mix(#000, $topiary-tint, 20%);

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

相近的命名颜色

Palettes with similar colors

在工具中打开

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