Adlandırılmış renk · #6E5A49
Christmas Ornament
Christmas Ornament, #6E5A49: rgb(110 90 73), hsl(28 20% 36%), oklch(0.483 0.037 62.1). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Brown mean? → · Christmas Ornament color name →
#6E5A49
oklch(0.483 0.037 62.1)
Renk dönüşümleri
- 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%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 7C695A
- 89796A
- 97887C
- A6998E
- B4A9A0
- C3BAB2
- D2CBC5
- E1DCD8
- F0EDEB
Koyu tonlar
- 5F4D3E
- 504134
- 41352A
- 332920
- 261E17
- 19130E
- 0E0906
- 040302
- 010000
Gri tonlar
- 705E4E
- 726254
- 746559
- 75695F
- 776D64
- 79716A
- 7B756F
- 7D7875
- 7E7C7A
Renk uyumları
Tamamlayıcı +180°
- 6E5A49
Christmas Ornament
- 4C6172
≈ English Channel
Analog -30° +30°
- 6E5A49
Christmas Ornament
- 725751
≈ Brown Ridge
- 665E46
≈ Squirrel’s Nest
Üçlü +120° +240°
- 6E5A49
Christmas Ornament
- 476660
≈ Grand Prix
- 625A70
≈ Head Over Heels
Bölünmüş tamamlayıcı +150° +210°
- 6E5A49
Christmas Ornament
- 46646B
≈ Night Folly
- 575D74
≈ Agate Violet
Dörtlü +90° +180° +270°
- 6E5A49
Christmas Ornament
- 4F6554
≈ Pasture Green
- 4C6172
≈ English Channel
- 6B5768
≈ Dark Purple Grey
Kontrast ve erişilebilirlik
Ag
AABeyaz üzerinde
WCAG 6.51:1 · APCA Lc 82
Ag
FailSiyah üzerinde
WCAG 3.22:1 · APCA Lc 20
En iyi metin rengi: #FFFFFF
WCAG 6.51:1 (AA) · APCA Lc 82
Contrast pairs
Kod parçacıkları
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);
}