Named color · #77CC88
Serengeti Green
Serengeti Green is #77CC88: rgb(119 204 136), hsl(132 45% 63%), oklch(0.774 0.128 149.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Green mean? → · Serengeti Green color name →
#77CC88
oklch(0.774 0.128 149.1)
Color conversions
- HEX
- #77cc88
- RGB
- rgb(119 204 136)
- HSL
- hsl(132 45% 63%)
- HWB
- hwb(132 47% 20%)
- OKLCH
- oklch(0.774 0.128 149.1)
- OKLab
- oklab(0.774 -0.11 0.065)
- CIE Lab
- lab(75.38 -37.82 25.59)
- LCH
- lch(75.38 45.66 145.9)
- CMYK
- cmyk(42% 0% 33% 20%)
Tints · Shades · Tones
Tints
- 86D194
- 94D7A0
- A2DCAC
- B0E1B7
- BDE6C3
- CBEBCF
- D8F0DB
- E5F5E7
- F2FAF3
Shades
- 67B175
- 579763
- 477E52
- 386541
- 2A4E31
- 1C3722
- 102213
- 050F06
- 010201
Tones
- 79C488
- 7BBD87
- 7DB587
- 7EAD86
- 7FA685
- 809E84
- 809783
- 808F82
- 808881
Color harmonies
Complementary +180°
- 77CC88
Serengeti Green
- E297DD
≈ Love Dust
Analogous -30° +30°
- 77CC88
Serengeti Green
- ACC15E
≈ Middle Green Yellow
- 3AD0B7
≈ Simply Aqua
Triadic +120° +240°
- 77CC88
Serengeti Green
- 98B2FF
≈ Widowmaker
- FC9586
≈ Adobe Avenue
Split-complementary +150° +210°
- 77CC88
Serengeti Green
- C1A2FB
≈ Diva
- F792B3
≈ Schauss Pink
Tetradic +90° +180° +270°
- 77CC88
Serengeti Green
- 5EC0FE
≈ Hello Summer
- E297DD
≈ Love Dust
- F1A05D
≈ Bergamot Orange
Contrast & accessibility
Ag
FailOn white
WCAG 1.94:1 · APCA Lc 37
Ag
AAAOn black
WCAG 10.77:1 · APCA Lc 65
Best text color: #000000
WCAG 10.77:1 (AAA) · APCA Lc 65
Contrast pairs
Code snippets
CSS
:root {
--serengeti-green: #77cc88;
--serengeti-green-rgb: 119 204 136;
--serengeti-green-oklch: oklch(0.774 0.128 149.1);
}
.element {
color: var(--serengeti-green);
background-color: hsl(132 45% 63%);
border-color: oklch(0.774 0.128 149.1);
}Tailwind CSS v4
@theme {
--color-serengeti-green: #77cc88;
--color-serengeti-green-50: #dcffe3;
--color-serengeti-green-100: #caf5d3;
--color-serengeti-green-200: #ade4b9;
--color-serengeti-green-300: #85ca96;
--color-serengeti-green-400: #64b374;
--color-serengeti-green-500: #3b9d55;
--color-serengeti-green-600: #348548;
--color-serengeti-green-700: #296a3a;
--color-serengeti-green-800: #1f4e27;
--color-serengeti-green-900: #15361a;
--color-serengeti-green-950: #06210a;
}SCSS
$serengeti-green: #77cc88;
$serengeti-green-rgb: 119, 204, 136;
$serengeti-green-light: mix(#fff, $serengeti-green, 20%);
$serengeti-green-dark: mix(#000, $serengeti-green, 20%);
.element {
color: $serengeti-green;
box-shadow: 0 0 0 2px rgba($serengeti-green, 0.35);
}