En yakın adlandırılmış renk · #77B800
#77B800
En yakın adlandırılmış renk: Jubilant Meadow
#77B800 (rgb(119 184 0), hsl(81 100% 36%), oklch(0.711 0.193 130.4)) en çok Jubilant Meadow adlı renge yakındır. Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
#77B800
oklch(0.711 0.193 130.4)
Renk dönüşümleri
- HEX
- #77b800
- RGB
- rgb(119 184 0)
- HSL
- hsl(81 100% 36%)
- HWB
- hwb(81 0% 28%)
- OKLCH
- oklch(0.711 0.193 130.4)
- OKLab
- oklab(0.711 -0.125 0.147)
- CIE Lab
- lab(68.36 -38.54 67.37)
- LCH
- lch(68.36 77.61 119.8)
- CMYK
- cmyk(35% 0% 100% 28%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 84C03A
- 92C757
- 9FCE6F
- ADD685
- BADD9A
- C8E4AF
- D5EBC3
- E3F2D7
- F1F8EB
Koyu tonlar
- 67A000
- 578800
- 477100
- 385B00
- 2A4500
- 1C3100
- 101E00
- 050C00
- 010200
Gri tonlar
- 78B329
- 7AAD3B
- 7BA849
- 7CA254
- 7D9D5D
- 7E9765
- 7E926D
- 7F8C74
- 80867A
Renk uyumları
Tamamlayıcı +180°
- 77B800
Jubilant Meadow
- C779F9
≈ Rosy Fluffy Bedspread
Analog -30° +30°
- 77B800
Jubilant Meadow
- B7A300
≈ Snakebite Leather
- 00BF7F
≈ Fennel Fiesta
Üçlü +120° +240°
- 77B800
Jubilant Meadow
- 4BA6FF
≈ Joust Blue
- FF6686
≈ Berlin Pink
Bölünmüş tamamlayıcı +150° +210°
- 77B800
Jubilant Meadow
- 9194FF
≈ Periwinkle Blue
- ED69C6
≈ Crumbly Lipstick
Dörtlü +90° +180° +270°
- 77B800
Jubilant Meadow
- 00B4DA
≈ Blue Atoll
- C779F9
≈ Rosy Fluffy Bedspread
- FF7037
≈ Bright Orange
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.43:1 · APCA Lc 48
Ag
AAASiyah üzerinde
WCAG 8.64:1 · APCA Lc 54
En iyi metin rengi: #000000
WCAG 8.64:1 (AAA) · APCA Lc 54
Contrast pairs
Kod parçacıkları
CSS
:root {
--jubilant-meadow: #77b800;
--jubilant-meadow-rgb: 119 184 0;
--jubilant-meadow-oklch: oklch(0.711 0.193 130.4);
}
.element {
color: var(--jubilant-meadow);
background-color: hsl(81 100% 36%);
border-color: oklch(0.711 0.193 130.4);
}Tailwind CSS v4
@theme {
--color-jubilant-meadow: #77b800;
--color-jubilant-meadow-50: #e1ffc9;
--color-jubilant-meadow-100: #d0f6b3;
--color-jubilant-meadow-200: #b5e68f;
--color-jubilant-meadow-300: #91cc5e;
--color-jubilant-meadow-400: #76b418;
--color-jubilant-meadow-500: #579c00;
--color-jubilant-meadow-600: #4a8400;
--color-jubilant-meadow-700: #3b6a00;
--color-jubilant-meadow-800: #2e4d00;
--color-jubilant-meadow-900: #1f3600;
--color-jubilant-meadow-950: #0f2100;
}SCSS
$jubilant-meadow: #77b800;
$jubilant-meadow-rgb: 119, 184, 0;
$jubilant-meadow-light: mix(#fff, $jubilant-meadow, 20%);
$jubilant-meadow-dark: mix(#000, $jubilant-meadow, 20%);
.element {
color: $jubilant-meadow;
box-shadow: 0 0 0 2px rgba($jubilant-meadow, 0.35);
}