Adlandırılmış renk · #7BB92B
Jubilant Meadow
Jubilant Meadow, #7BB92B: rgb(123 185 43), hsl(86 62% 45%), oklch(0.717 0.179 130.9). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Green mean? → · Jubilant Meadow color name →
#7BB92B
oklch(0.717 0.179 130.9)
Renk dönüşümleri
- HEX
- #7bb92b
- RGB
- rgb(123 185 43)
- HSL
- hsl(86 62% 45%)
- HWB
- hwb(86 17% 27%)
- OKLCH
- oklch(0.717 0.179 130.9)
- OKLab
- oklab(0.717 -0.117 0.135)
- CIE Lab
- lab(68.99 -36.56 59.88)
- LCH
- lch(68.99 70.16 121.4)
- CMYK
- cmyk(34% 0% 77% 27%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 88C04A
- 95C862
- A2CF77
- AFD68C
- BCDDA0
- C9E4B3
- D7EBC6
- E4F2D9
- F1F8EC
Koyu tonlar
- 6AA024
- 5A891D
- 4A7116
- 3A5B10
- 2C460A
- 1E3105
- 101E02
- 050D01
- 010200
Gri tonlar
- 7CB43C
- 7DAE48
- 7DA852
- 7EA35B
- 7F9D63
- 7F9769
- 7F9270
- 808C76
- 80867B
Renk uyumları
Tamamlayıcı +180°
- 7BB92B
Jubilant Meadow
- C77FF5
≈ Azuremyst Isle
Analog -30° +30°
- 7BB92B
Jubilant Meadow
- B9A500
≈ Sulphine Yellow
- 00C182
≈ Greenish Teal
Üçlü +120° +240°
- 7BB92B
Jubilant Meadow
- 52A8FF
≈ Joust Blue
- FE6C88
≈ Ultra Red
Bölünmüş tamamlayıcı +150° +210°
- 7BB92B
Jubilant Meadow
- 9496FF
≈ Cobalite
- EB71C5
≈ Explicit Pink
Dörtlü +90° +180° +270°
- 7BB92B
Jubilant Meadow
- 00B6DD
≈ Blue Atoll
- C77FF5
≈ Azuremyst Isle
- FD7640
≈ Precious Persimmon
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.38:1 · APCA Lc 47
Ag
AAASiyah üzerinde
WCAG 8.81:1 · APCA Lc 55
En iyi metin rengi: #000000
WCAG 8.81:1 (AAA) · APCA Lc 55
Contrast pairs
Kod parçacıkları
CSS
:root {
--jubilant-meadow: #7bb92b;
--jubilant-meadow-rgb: 123 185 43;
--jubilant-meadow-oklch: oklch(0.717 0.179 130.9);
}
.element {
color: var(--jubilant-meadow);
background-color: hsl(86 62% 45%);
border-color: oklch(0.717 0.179 130.9);
}Tailwind CSS v4
@theme {
--color-jubilant-meadow: #7bb92b;
--color-jubilant-meadow-50: #e2ffcc;
--color-jubilant-meadow-100: #d1f5b8;
--color-jubilant-meadow-200: #b6e595;
--color-jubilant-meadow-300: #93cb67;
--color-jubilant-meadow-400: #78b32f;
--color-jubilant-meadow-500: #599b00;
--color-jubilant-meadow-600: #4c8400;
--color-jubilant-meadow-700: #3d6900;
--color-jubilant-meadow-800: #2e4d00;
--color-jubilant-meadow-900: #1f3600;
--color-jubilant-meadow-950: #0f2000;
}SCSS
$jubilant-meadow: #7bb92b;
$jubilant-meadow-rgb: 123, 185, 43;
$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);
}