Adlandırılmış renk · #B3B17B
Weeping Willow
Weeping Willow, #B3B17B: rgb(179 177 123), hsl(58 27% 59%), oklch(0.749 0.073 106.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Yellow mean? → · Weeping Willow color name →
#B3B17B
oklch(0.749 0.073 106.2)
Renk dönüşümleri
- HEX
- #b3b17b
- RGB
- rgb(179 177 123)
- HSL
- hsl(58 27% 59%)
- HWB
- hwb(58 48% 30%)
- OKLCH
- oklch(0.749 0.073 106.2)
- OKLab
- oklab(0.749 -0.02 0.07)
- CIE Lab
- lab(71.38 -5.56 27.99)
- LCH
- lch(71.38 28.54 101.2)
- CMYK
- cmyk(0% 1% 31% 30%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- BAB988
- C2C095
- C9C8A2
- D1D0AF
- D8D8BD
- E0DFCA
- E8E7D7
- EFEFE4
- F7F7F2
Koyu tonlar
- 9B996A
- 84835A
- 6E6C4A
- 58573A
- 43422C
- 2F2F1E
- 1D1C10
- 0C0C05
- 010101
Gri tonlar
- AEAC7C
- A8A77D
- A3A27E
- 9E9D7E
- 99987F
- 94937F
- 8F8F80
- 8A8A80
- 858580
Renk uyumları
Tamamlayıcı +180°
- B3B17B
Weeping Willow
- A9A7DA
≈ Childish Wonder
Analog -30° +30°
- B3B17B
Weeping Willow
- C8A879
≈ Sugar Pie
- 99B98B
≈ Green Snow
Üçlü +120° +240°
- B3B17B
Weeping Willow
- 7BB8D1
≈ Blue Chrysocolla
- D09BB7
≈ Exotic Lilac
Bölünmüş tamamlayıcı +150° +210°
- B3B17B
Weeping Willow
- 90B0DC
≈ Blue Skies Today
- C0A0CD
≈ Lilac Pink
Dörtlü +90° +180° +270°
- B3B17B
Weeping Willow
- 74BCBD
≈ Aqua Sky
- A9A7DA
≈ Childish Wonder
- D89B9E
≈ Parrot Pink
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.21:1 · APCA Lc 44
Ag
AAASiyah üzerinde
WCAG 9.49:1 · APCA Lc 59
En iyi metin rengi: #000000
WCAG 9.49:1 (AAA) · APCA Lc 59
Contrast pairs
Kod parçacıkları
CSS
:root {
--weeping-willow: #b3b17b;
--weeping-willow-rgb: 179 177 123;
--weeping-willow-oklch: oklch(0.749 0.073 106.2);
}
.element {
color: var(--weeping-willow);
background-color: hsl(58 27% 59%);
border-color: oklch(0.749 0.073 106.2);
}Tailwind CSS v4
@theme {
--color-weeping-willow: #b3b17b;
--color-weeping-willow-50: #f7f7e0;
--color-weeping-willow-100: #eaeacf;
--color-weeping-willow-200: #d7d7b4;
--color-weeping-willow-300: #babb90;
--color-weeping-willow-400: #a3a26f;
--color-weeping-willow-500: #8c894f;
--color-weeping-willow-600: #767443;
--color-weeping-willow-700: #5f5d36;
--color-weeping-willow-800: #464425;
--color-weeping-willow-900: #312f19;
--color-weeping-willow-950: #1d1b0a;
}SCSS
$weeping-willow: #b3b17b;
$weeping-willow-rgb: 179, 177, 123;
$weeping-willow-light: mix(#fff, $weeping-willow, 20%);
$weeping-willow-dark: mix(#000, $weeping-willow, 20%);
.element {
color: $weeping-willow;
box-shadow: 0 0 0 2px rgba($weeping-willow, 0.35);
}