命名颜色 · #A4A298

Tin Man

Tin Man 即 #A4A298：rgb(164 162 152)、hsl(50 6% 62%)、oklch(0.711 0.014 97.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

What does Gray mean? → · Tin Man color name →

#A4A298

oklch(0.711 0.014 97.5)

颜色转换

HEX: #a4a298
RGB: rgb(164 162 152)
HSL: hsl(50 6% 62%)
HWB: hwb(50 60% 36%)
OKLCH: oklch(0.711 0.014 97.5)
OKLab: oklab(0.711 -0.002 0.014)
CIE Lab: lab(66.57 -0.62 5.49)
LCH: lch(66.57 5.52 96.4)
CMYK: cmyk(0% 1% 7% 36%)

浅色调 · 深色调 · 灰色调

浅色调

ADABA2
B6B4AC
BEBDB6
C7C6C0
D1D0CA
DAD9D5
E3E2DF
ECECEA
F6F5F4

深色调

8E8C84
797770
64635C
504F4A
3D3C38
2B2A27
1A1917
0A0A08
010101

灰色调

A09F96
9D9B93
999891
95948E
92918C
8E8D8A
8B8A87
878785
848382

配色和谐

互补色 +180°

A4A298
Tin Man
9FA1AB
≈ Amethyst Haze

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

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

对比度与无障碍

白底

WCAG 2.56:1 · APCA Lc 50

Fail

黑底

WCAG 8.20:1 · APCA Lc 52

AAA

最佳文字颜色: #000000

WCAG 8.20:1 (AAA) · APCA Lc 52

Contrast pairs

代码片段

CSS

:root {
  --tin-man: #a4a298;
  --tin-man-rgb: 164 162 152;
  --tin-man-oklch: oklch(0.711 0.014 97.5);
}

.element {
  color: var(--tin-man);
  background-color: hsl(50 6% 62%);
  border-color: oklch(0.711 0.014 97.5);
}

Tailwind CSS v4

@theme {
  --color-tin-man: #a4a298;
  --color-tin-man-50: #f6f5f1;
  --color-tin-man-100: #e9e8e3;
  --color-tin-man-200: #d5d4ce;
  --color-tin-man-300: #b9b8af;
  --color-tin-man-400: #a09f95;
  --color-tin-man-500: #89867c;
  --color-tin-man-600: #747269;
  --color-tin-man-700: #5c5b54;
  --color-tin-man-800: #44423d;
  --color-tin-man-900: #2f2e2a;
  --color-tin-man-950: #1b1b17;
}

SCSS

$tin-man: #a4a298;
$tin-man-rgb: 164, 162, 152;
$tin-man-light: mix(#fff, $tin-man, 20%);
$tin-man-dark: mix(#000, $tin-man, 20%);

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

相近的命名颜色

Palettes with similar colors

在工具中打开

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