命名颜色 · #6E5A49

Christmas Ornament

Christmas Ornament 即 #6E5A49：rgb(110 90 73)、hsl(28 20% 36%)、oklch(0.483 0.037 62.1)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

What does Brown mean? → · Christmas Ornament color name →

#6E5A49

oklch(0.483 0.037 62.1)

颜色转换

HEX: #6e5a49
RGB: rgb(110 90 73)
HSL: hsl(28 20% 36%)
HWB: hwb(28 29% 57%)
OKLCH: oklch(0.483 0.037 62.1)
OKLab: oklab(0.483 0.017 0.033)
CIE Lab: lab(39.92 6.43 13.09)
LCH: lch(39.92 14.58 63.8)
CMYK: cmyk(0% 18% 34% 57%)

浅色调 · 深色调 · 灰色调

浅色调

7C695A
89796A
97887C
A6998E
B4A9A0
C3BAB2
D2CBC5
E1DCD8
F0EDEB

深色调

5F4D3E
504134
41352A
332920
261E17
19130E
0E0906
040302
010000

灰色调

705E4E
726254
746559
75695F
776D64
79716A
7B756F
7D7875
7E7C7A

配色和谐

互补色 +180°

6E5A49
Christmas Ornament
4C6172
≈ English Channel

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

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

对比度与无障碍

白底

WCAG 6.51:1 · APCA Lc 82

黑底

WCAG 3.22:1 · APCA Lc 20

Fail

最佳文字颜色: #FFFFFF

WCAG 6.51:1 (AA) · APCA Lc 82

Contrast pairs

代码片段

CSS

:root {
  --christmas-ornament: #6e5a49;
  --christmas-ornament-rgb: 110 90 73;
  --christmas-ornament-oklch: oklch(0.483 0.037 62.1);
}

.element {
  color: var(--christmas-ornament);
  background-color: hsl(28 20% 36%);
  border-color: oklch(0.483 0.037 62.1);
}

Tailwind CSS v4

@theme {
  --color-christmas-ornament: #6e5a49;
  --color-christmas-ornament-50: #fdf3ea;
  --color-christmas-ornament-100: #f1e6db;
  --color-christmas-ornament-200: #e0d1c4;
  --color-christmas-ornament-300: #c5b4a4;
  --color-christmas-ornament-400: #af9a89;
  --color-christmas-ornament-500: #99816d;
  --color-christmas-ornament-600: #816d5d;
  --color-christmas-ornament-700: #67574a;
  --color-christmas-ornament-800: #4c4036;
  --color-christmas-ornament-900: #352c25;
  --color-christmas-ornament-950: #201913;
}

SCSS

$christmas-ornament: #6e5a49;
$christmas-ornament-rgb: 110, 90, 73;
$christmas-ornament-light: mix(#fff, $christmas-ornament, 20%);
$christmas-ornament-dark: mix(#000, $christmas-ornament, 20%);

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

相近的命名颜色

Palettes with similar colors

在工具中打开

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