Adlandırılmış renk · #B7B38D
Powdered Sage
Powdered Sage, #B7B38D: rgb(183 179 141), hsl(54 23% 64%), oklch(0.76 0.052 102.5). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Yellow mean? → · Powdered Sage color name →
#B7B38D
oklch(0.76 0.052 102.5)
Renk dönüşümleri
- HEX
- #b7b38d
- RGB
- rgb(183 179 141)
- HSL
- hsl(54 23% 64%)
- HWB
- hwb(54 55% 28%)
- OKLCH
- oklch(0.76 0.052 102.5)
- OKLab
- oklab(0.76 -0.011 0.051)
- CIE Lab
- lab(72.54 -3.16 20.04)
- LCH
- lch(72.54 20.28 99)
- CMYK
- cmyk(0% 2% 23% 28%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- BEBA98
- C5C2A3
- CCC9AF
- D3D1BA
- DAD9C5
- E2E0D1
- E9E8DC
- F0F0E8
- F8F7F3
Koyu tonlar
- 9F9B7A
- 878467
- 706E55
- 5A5844
- 454333
- 312F23
- 1E1D14
- 0C0C07
- 020101
Gri tonlar
- B1AE8C
- ACA98B
- A6A38A
- A19E88
- 9B9987
- 969486
- 908F84
- 8B8A83
- 858582
Renk uyumları
Tamamlayıcı +180°
- B7B38D
Powdered Sage
- ACAED2
≈ Lavender Wash
Analog -30° +30°
- B7B38D
Powdered Sage
- C6AD8D
≈ Warm Sand
- A5B997
≈ Byakuroku Green
Üçlü +120° +240°
- B7B38D
Powdered Sage
- 8DB9C9
≈ Blue Echo
- CAA5BA
≈ Fragrant Lilac
Bölünmüş tamamlayıcı +150° +210°
- B7B38D
Powdered Sage
- 9AB4D2
≈ Blue Satin
- BDA8C9
≈ Extraordinaire
Dörtlü +90° +180° +270°
- B7B38D
Powdered Sage
- 8BBCBA
≈ Lorian
- ACAED2
≈ Lavender Wash
- D0A4A8
≈ Pink Cocoa Cupcake
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.13:1 · APCA Lc 42
Ag
AAASiyah üzerinde
WCAG 9.84:1 · APCA Lc 60
En iyi metin rengi: #000000
WCAG 9.84:1 (AAA) · APCA Lc 60
Contrast pairs
Kod parçacıkları
CSS
:root {
--powdered-sage: #b7b38d;
--powdered-sage-rgb: 183 179 141;
--powdered-sage-oklch: oklch(0.76 0.052 102.5);
}
.element {
color: var(--powdered-sage);
background-color: hsl(54 23% 64%);
border-color: oklch(0.76 0.052 102.5);
}Tailwind CSS v4
@theme {
--color-powdered-sage: #b7b38d;
--color-powdered-sage-50: #f7f6e5;
--color-powdered-sage-100: #eae9d6;
--color-powdered-sage-200: #d7d6bd;
--color-powdered-sage-300: #bbb99b;
--color-powdered-sage-400: #a4a07d;
--color-powdered-sage-500: #8c885f;
--color-powdered-sage-600: #777351;
--color-powdered-sage-700: #5f5c41;
--color-powdered-sage-800: #46432e;
--color-powdered-sage-900: #312e1f;
--color-powdered-sage-950: #1d1b0f;
}SCSS
$powdered-sage: #b7b38d;
$powdered-sage-rgb: 183, 179, 141;
$powdered-sage-light: mix(#fff, $powdered-sage, 20%);
$powdered-sage-dark: mix(#000, $powdered-sage, 20%);
.element {
color: $powdered-sage;
box-shadow: 0 0 0 2px rgba($powdered-sage, 0.35);
}