Adlandırılmış renk · #7CB77B
Colour Me Green
Colour Me Green, #7CB77B: rgb(124 183 123), hsl(119 29% 60%), oklch(0.723 0.105 144). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Green mean? → · Colour Me Green color name →
#7CB77B
oklch(0.723 0.105 144)
Renk dönüşümleri
- HEX
- #7cb77b
- RGB
- rgb(124 183 123)
- HSL
- hsl(119 29% 60%)
- HWB
- hwb(119 48% 28%)
- OKLCH
- oklch(0.723 0.105 144)
- OKLab
- oklab(0.723 -0.085 0.062)
- CIE Lab
- lab(69.21 -29 24.27)
- LCH
- lch(69.21 37.81 140.1)
- CMYK
- cmyk(32% 0% 33% 28%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 89BE88
- 96C595
- A3CDA2
- B0D4AF
- BDDBBC
- CBE2C9
- D8E9D7
- E5F1E4
- F2F8F1
Koyu tonlar
- 6B9F6A
- 5A875A
- 4A704A
- 3B5A3A
- 2C452C
- 1E311E
- 111E10
- 050C05
- 010201
Gri tonlar
- 7DB17C
- 7EAC7D
- 7FA77D
- 7FA17E
- 809C7F
- 80967F
- 80917F
- 808B80
- 808680
Renk uyumları
Tamamlayıcı +180°
- 7CB77B
Colour Me Green
- C68FCB
≈ Rose Souvenir
Analog -30° +30°
- 7CB77B
Colour Me Green
- A5AD5D
≈ Stay in Lime
- 52BBA1
≈ Jolt of Jade
Üçlü +120° +240°
- 7CB77B
Colour Me Green
- 84A5E8
≈ Blue Cue
- E08B85
≈ Coral Haze
Bölünmüş tamamlayıcı +150° +210°
- 7CB77B
Colour Me Green
- A999E1
≈ Dull Lavender
- D989AA
≈ Springtime Bloom
Dörtlü +90° +180° +270°
- 7CB77B
Colour Me Green
- 5CB0DD
≈ Sail Away
- C68FCB
≈ Rose Souvenir
- D99364
≈ Summer’s End
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.35:1 · APCA Lc 46
Ag
AAASiyah üzerinde
WCAG 8.91:1 · APCA Lc 56
En iyi metin rengi: #000000
WCAG 8.91:1 (AAA) · APCA Lc 56
Contrast pairs
Kod parçacıkları
CSS
:root {
--colour-me-green: #7cb77b;
--colour-me-green-rgb: 124 183 123;
--colour-me-green-oklch: oklch(0.723 0.105 144);
}
.element {
color: var(--colour-me-green);
background-color: hsl(119 29% 60%);
border-color: oklch(0.723 0.105 144);
}Tailwind CSS v4
@theme {
--color-colour-me-green: #7cb77b;
--color-colour-me-green-50: #e3fee4;
--color-colour-me-green-100: #d2f2d3;
--color-colour-me-green-200: #b8e1ba;
--color-colour-me-green-300: #95c697;
--color-colour-me-green-400: #77af76;
--color-colour-me-green-500: #589858;
--color-colour-me-green-600: #4b814b;
--color-colour-me-green-700: #3c673b;
--color-colour-me-green-800: #2c4b29;
--color-colour-me-green-900: #1e341b;
--color-colour-me-green-950: #0d200c;
}SCSS
$colour-me-green: #7cb77b;
$colour-me-green-rgb: 124, 183, 123;
$colour-me-green-light: mix(#fff, $colour-me-green, 20%);
$colour-me-green-dark: mix(#000, $colour-me-green, 20%);
.element {
color: $colour-me-green;
box-shadow: 0 0 0 2px rgba($colour-me-green, 0.35);
}