Adlandırılmış renk · #97774D
Weathered Wicker
Weathered Wicker, #97774D: rgb(151 119 77), hsl(34 32% 45%), oklch(0.59 0.07 73.3). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Weathered Wicker color name →
#97774D
oklch(0.59 0.07 73.3)
Renk dönüşümleri
- HEX
- #97774d
- RGB
- rgb(151 119 77)
- HSL
- hsl(34 32% 45%)
- HWB
- hwb(34 30% 41%)
- OKLCH
- oklch(0.59 0.07 73.3)
- OKLab
- oklab(0.59 0.02 0.068)
- CIE Lab
- lab(52.46 8.84 28.03)
- LCH
- lch(52.46 29.39 72.5)
- CMYK
- cmyk(0% 21% 49% 41%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- A1845E
- AB9170
- B69E81
- C0AC92
- CAB9A4
- D5C7B6
- DFD5C8
- EAE3DA
- F4F1EC
Koyu tonlar
- 836742
- 6F5737
- 5C472C
- 493822
- 372A18
- 261C0F
- 171007
- 080502
- 010100
Gri tonlar
- 957853
- 937958
- 907A5E
- 8E7B63
- 8C7C68
- 8A7D6D
- 877E72
- 857E77
- 827F7B
Renk uyumları
Tamamlayıcı +180°
- 97774D
Weathered Wicker
- 5F80A7
≈ Revival
Analog -30° +30°
- 97774D
Weathered Wicker
- A1705B
≈ Toast
- 857F4D
≈ Green Moss
Üçlü +120° +240°
- 97774D
Weathered Wicker
- 458B89
≈ Royal Palm
- 8C719B
≈ Fuji Purple
Bölünmüş tamamlayıcı +150° +210°
- 97774D
Weathered Wicker
- 4B879C
≈ Hippie Blue
- 7778A6
≈ Minuet Lilac
Dörtlü +90° +180° +270°
- 97774D
Weathered Wicker
- 548B72
≈ Molly Robins
- 5F80A7
≈ Revival
- 9B6D88
≈ Pink Jazz
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 4.14:1 · APCA Lc 68
Ag
AASiyah üzerinde
WCAG 5.06:1 · APCA Lc 33
En iyi metin rengi: #000000
WCAG 5.06:1 (AA) · APCA Lc 33
Contrast pairs
Kod parçacıkları
CSS
:root {
--weathered-wicker: #97774d;
--weathered-wicker-rgb: 151 119 77;
--weathered-wicker-oklch: oklch(0.59 0.07 73.3);
}
.element {
color: var(--weathered-wicker);
background-color: hsl(34 32% 45%);
border-color: oklch(0.59 0.07 73.3);
}Tailwind CSS v4
@theme {
--color-weathered-wicker: #97774d;
--color-weathered-wicker-50: #fff3df;
--color-weathered-wicker-100: #f6e5cf;
--color-weathered-wicker-200: #e6d1b4;
--color-weathered-wicker-300: #cdb390;
--color-weathered-wicker-400: #b89870;
--color-weathered-wicker-500: #a37f50;
--color-weathered-wicker-600: #896c44;
--color-weathered-wicker-700: #6e5636;
--color-weathered-wicker-800: #523e26;
--color-weathered-wicker-900: #392b1a;
--color-weathered-wicker-950: #23180a;
}SCSS
$weathered-wicker: #97774d;
$weathered-wicker-rgb: 151, 119, 77;
$weathered-wicker-light: mix(#fff, $weathered-wicker, 20%);
$weathered-wicker-dark: mix(#000, $weathered-wicker, 20%);
.element {
color: $weathered-wicker;
box-shadow: 0 0 0 2px rgba($weathered-wicker, 0.35);
}