Adlandırılmış renk · #6A5143
Plantation Shutters
Plantation Shutters, #6A5143: rgb(106 81 67), hsl(22 23% 34%), oklch(0.457 0.04 50.6). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Brown mean? → · Plantation Shutters color name →
#6A5143
oklch(0.457 0.04 50.6)
Renk dönüşümleri
- HEX
- #6a5143
- RGB
- rgb(106 81 67)
- HSL
- hsl(22 23% 34%)
- HWB
- hwb(22 26% 58%)
- OKLCH
- oklch(0.457 0.04 50.6)
- OKLab
- oklab(0.457 0.026 0.031)
- CIE Lab
- lab(36.83 9.2 12.49)
- LCH
- lch(36.83 15.51 53.6)
- CMYK
- cmyk(0% 24% 37% 58%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 786154
- 867165
- 958277
- A39389
- B2A49C
- C1B6AF
- D0C8C3
- E0DAD6
- EFECEB
Koyu tonlar
- 5B4539
- 4D3A2F
- 3F2F26
- 31241D
- 241A14
- 18100C
- 0D0705
- 040201
- 000000
Gri tonlar
- 6C5649
- 6F5A4F
- 715F55
- 73645B
- 756861
- 786D67
- 7A726D
- 7C7674
- 7E7B7A
Renk uyumları
Tamamlayıcı +180°
- 6A5143
Plantation Shutters
- 405C6A
≈ Blue Spell
Analog -30° +30°
- 6A5143
Plantation Shutters
- 6C4E4E
≈ Marron
- 63553D
≈ Protégé Bronze
Üçlü +120° +240°
- 6A5143
Plantation Shutters
- 405F54
≈ Emerson
- 57546C
≈ Majestic Magic
Bölünmüş tamamlayıcı +150° +210°
- 6A5143
Plantation Shutters
- 3B5E60
≈ Rosemary
- 4A586E
≈ Bering Sea
Dörtlü +90° +180° +270°
- 6A5143
Plantation Shutters
- 4B5D48
≈ Muddy Olive
- 405C6A
≈ Blue Spell
- 625065
≈ Vintage Violet
Kontrast ve erişilebilirlik
Ag
AAABeyaz üzerinde
WCAG 7.31:1 · APCA Lc 85
Ag
FailSiyah üzerinde
WCAG 2.87:1 · APCA Lc 17
En iyi metin rengi: #FFFFFF
WCAG 7.31:1 (AAA) · APCA Lc 85
Contrast pairs
Kod parçacıkları
CSS
:root {
--plantation-shutters: #6a5143;
--plantation-shutters-rgb: 106 81 67;
--plantation-shutters-oklch: oklch(0.457 0.04 50.6);
}
.element {
color: var(--plantation-shutters);
background-color: hsl(22 23% 34%);
border-color: oklch(0.457 0.04 50.6);
}Tailwind CSS v4
@theme {
--color-plantation-shutters: #6a5143;
--color-plantation-shutters-50: #fff2eb;
--color-plantation-shutters-100: #f3e5dc;
--color-plantation-shutters-200: #e3d0c5;
--color-plantation-shutters-300: #c9b2a5;
--color-plantation-shutters-400: #b39889;
--color-plantation-shutters-500: #9d7f6e;
--color-plantation-shutters-600: #856c5e;
--color-plantation-shutters-700: #6a564b;
--color-plantation-shutters-800: #4e3e36;
--color-plantation-shutters-900: #372b25;
--color-plantation-shutters-950: #211814;
}SCSS
$plantation-shutters: #6a5143;
$plantation-shutters-rgb: 106, 81, 67;
$plantation-shutters-light: mix(#fff, $plantation-shutters, 20%);
$plantation-shutters-dark: mix(#000, $plantation-shutters, 20%);
.element {
color: $plantation-shutters;
box-shadow: 0 0 0 2px rgba($plantation-shutters, 0.35);
}