이름 색상 · #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