Adlandırılmış renk · #99522C
Hawaiian Coconut
Hawaiian Coconut, #99522C: rgb(153 82 44), hsl(21 55% 39%), oklch(0.516 0.108 47.1). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Brown mean? → · Hawaiian Coconut color name →
#99522C
oklch(0.516 0.108 47.1)
Renk dönüşümleri
- HEX
- #99522c
- RGB
- rgb(153 82 44)
- HSL
- hsl(21 55% 39%)
- HWB
- hwb(21 17% 40%)
- OKLCH
- oklch(0.516 0.108 47.1)
- OKLab
- oklab(0.516 0.073 0.079)
- CIE Lab
- lab(43.2 27.93 35.36)
- LCH
- lch(43.2 45.06 51.7)
- CMYK
- cmyk(0% 46% 71% 40%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- A46342
- AF7456
- BA856B
- C4967F
- CEA794
- D8B8A9
- E2C9BE
- ECDBD3
- F6EDE9
Koyu tonlar
- 844625
- 703B1E
- 5D2F17
- 4A2511
- 381A0A
- 271105
- 170802
- 080201
- 010000
Gri tonlar
- 975736
- 955C3F
- 936148
- 916651
- 8F6B59
- 8C6F61
- 8A7369
- 877871
- 837C78
Renk uyumları
Tamamlayıcı +180°
- 99522C
Hawaiian Coconut
- 007294
≈ Enchanted Blue
Analog -30° +30°
- 99522C
Hawaiian Coconut
- 9C4B51
≈ Baked Bahama
- 8A5E01
≈ Rat Brown
Üçlü +120° +240°
- 99522C
Hawaiian Coconut
- 007B5B
≈ Emerald Dream
- 655DA2
≈ Giant Onion
Bölünmüş tamamlayıcı +150° +210°
- 99522C
Hawaiian Coconut
- 007779
≈ Prismarine
- 3D68A5
≈ Indigo Batik
Dörtlü +90° +180° +270°
- 99522C
Hawaiian Coconut
- 487635
≈ Cucumber Queen
- 007294
≈ Enchanted Blue
- 815390
≈ Voodoo Violet
Kontrast ve erişilebilirlik
Ag
AABeyaz üzerinde
WCAG 5.83:1 · APCA Lc 79
Ag
FailSiyah üzerinde
WCAG 3.59:1 · APCA Lc 23
En iyi metin rengi: #FFFFFF
WCAG 5.83:1 (AA) · APCA Lc 79
Contrast pairs
Kod parçacıkları
CSS
:root {
--hawaiian-coconut: #99522c;
--hawaiian-coconut-rgb: 153 82 44;
--hawaiian-coconut-oklch: oklch(0.516 0.108 47.1);
}
.element {
color: var(--hawaiian-coconut);
background-color: hsl(21 55% 39%);
border-color: oklch(0.516 0.108 47.1);
}Tailwind CSS v4
@theme {
--color-hawaiian-coconut: #99522c;
--color-hawaiian-coconut-50: #ffeddb;
--color-hawaiian-coconut-100: #ffdec9;
--color-hawaiian-coconut-200: #fbc7ac;
--color-hawaiian-coconut-300: #e5a786;
--color-hawaiian-coconut-400: #d38a66;
--color-hawaiian-coconut-500: #bf6e43;
--color-hawaiian-coconut-600: #a25d3a;
--color-hawaiian-coconut-700: #824a2e;
--color-hawaiian-coconut-800: #613521;
--color-hawaiian-coconut-900: #442416;
--color-hawaiian-coconut-950: #2c1307;
}SCSS
$hawaiian-coconut: #99522c;
$hawaiian-coconut-rgb: 153, 82, 44;
$hawaiian-coconut-light: mix(#fff, $hawaiian-coconut, 20%);
$hawaiian-coconut-dark: mix(#000, $hawaiian-coconut, 20%);
.element {
color: $hawaiian-coconut;
box-shadow: 0 0 0 2px rgba($hawaiian-coconut, 0.35);
}