Adlandırılmış renk · #B5A78D
Sleepy Owlet
Sleepy Owlet, #B5A78D: rgb(181 167 141), hsl(39 21% 63%), oklch(0.733 0.04 83). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Sleepy Owlet color name →
#B5A78D
oklch(0.733 0.04 83)
Renk dönüşümleri
- HEX
- #b5a78d
- RGB
- rgb(181 167 141)
- HSL
- hsl(39 21% 63%)
- HWB
- hwb(39 55% 29%)
- OKLCH
- oklch(0.733 0.04 83)
- OKLab
- oklab(0.733 0.005 0.039)
- CIE Lab
- lab(69.18 2.1 15.44)
- LCH
- lch(69.18 15.58 82.2)
- CMYK
- cmyk(0% 8% 22% 29%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- BCB098
- C3B8A3
- CBC1AE
- D2C9BA
- D9D2C5
- E1DBD0
- E8E4DC
- F0EDE8
- F7F6F3
Koyu tonlar
- 9D917A
- 867B67
- 6F6655
- 595244
- 443E33
- 302C23
- 1D1A14
- 0C0A07
- 020101
Gri tonlar
- B0A38C
- AA9F8B
- A59B89
- 9F9788
- 9A9387
- 958F86
- 908C84
- 8A8883
- 858481
Renk uyumları
Tamamlayıcı +180°
- B5A78D
Sleepy Owlet
- 9CA9C2
≈ Scorpion Grass Blue
Analog -30° +30°
- B5A78D
Sleepy Owlet
- BEA292
≈ Interface Tan
- A8AC90
≈ Verde Tortuga
Üçlü +120° +240°
- B5A78D
Sleepy Owlet
- 8CB1B4
≈ Bon Voyage
- B5A1B8
≈ Emanation
Bölünmüş tamamlayıcı +150° +210°
- B5A78D
Sleepy Owlet
- 91AEBE
≈ Showcase Blue
- A9A5C0
≈ Fife
Dörtlü +90° +180° +270°
- B5A78D
Sleepy Owlet
- 90B1A6
≈ Longfellow
- 9CA9C2
≈ Scorpion Grass Blue
- BE9FAB
≈ Decanting
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.36:1 · APCA Lc 47
Ag
AAASiyah üzerinde
WCAG 8.87:1 · APCA Lc 55
En iyi metin rengi: #000000
WCAG 8.87:1 (AAA) · APCA Lc 55
Contrast pairs
Kod parçacıkları
CSS
:root {
--sleepy-owlet: #b5a78d;
--sleepy-owlet-rgb: 181 167 141;
--sleepy-owlet-oklch: oklch(0.733 0.04 83);
}
.element {
color: var(--sleepy-owlet);
background-color: hsl(39 21% 63%);
border-color: oklch(0.733 0.04 83);
}Tailwind CSS v4
@theme {
--color-sleepy-owlet: #b5a78d;
--color-sleepy-owlet-50: #faf5e9;
--color-sleepy-owlet-100: #eee7d9;
--color-sleepy-owlet-200: #dcd3c2;
--color-sleepy-owlet-300: #c1b6a1;
--color-sleepy-owlet-400: #aa9d84;
--color-sleepy-owlet-500: #938469;
--color-sleepy-owlet-600: #7c7059;
--color-sleepy-owlet-700: #645947;
--color-sleepy-owlet-800: #494133;
--color-sleepy-owlet-900: #332d23;
--color-sleepy-owlet-950: #1f1a12;
}SCSS
$sleepy-owlet: #b5a78d;
$sleepy-owlet-rgb: 181, 167, 141;
$sleepy-owlet-light: mix(#fff, $sleepy-owlet, 20%);
$sleepy-owlet-dark: mix(#000, $sleepy-owlet, 20%);
.element {
color: $sleepy-owlet;
box-shadow: 0 0 0 2px rgba($sleepy-owlet, 0.35);
}