Named color · #88CC33
Overgrowth
Overgrowth is #88CC33: rgb(136 204 51), hsl(87 60% 50%), oklch(0.772 0.191 131). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Green mean? → · Overgrowth color name →
#88CC33
oklch(0.772 0.191 131)
Color conversions
- HEX
- #88cc33
- RGB
- rgb(136 204 51)
- HSL
- hsl(87 60% 50%)
- HWB
- hwb(87 20% 20%)
- OKLCH
- oklch(0.772 0.191 131)
- OKLab
- oklab(0.772 -0.125 0.144)
- CIE Lab
- lab(75.43 -39.26 63.63)
- LCH
- lch(75.43 74.77 121.7)
- CMYK
- cmyk(33% 0% 75% 20%)
Tints · Shades · Tones
Tints
- 94D251
- A0D769
- ACDC7E
- B8E292
- C3E7A5
- CFECB7
- DBF1C9
- E7F6DB
- F3FAED
Shades
- 75B12B
- 639723
- 527E1C
- 416514
- 314E0D
- 223707
- 132203
- 060F01
- 010200
Tones
- 88C443
- 87BD4E
- 87B558
- 86AE60
- 85A667
- 849F6D
- 839773
- 829078
- 81887C
Color harmonies
Complementary +180°
- 88CC33
Overgrowth
- D595FF
≈ Lilás
Analogous -30° +30°
- 88CC33
Overgrowth
- CBB600
≈ Mustard
- 00D590
≈ Envy’s Love
Triadic +120° +240°
- 88CC33
Overgrowth
- 78BAFF
≈ Cooler Than Ever
- FF8D9F
≈ Charming Cherry
Split-complementary +150° +210°
- 88CC33
Overgrowth
- A7ABFF
≈ Shy Moment
- FF81D7
≈ Pout Pink
Tetradic +90° +180° +270°
- 88CC33
Overgrowth
- 00C8F4
≈ Picnic Day Sky
- D595FF
≈ Lilás
- FF946C
≈ Hibiscus Delight
Contrast & accessibility
Ag
FailOn white
WCAG 1.95:1 · APCA Lc 37
Ag
AAAOn black
WCAG 10.73:1 · APCA Lc 65
Best text color: #000000
WCAG 10.73:1 (AAA) · APCA Lc 65
Contrast pairs
Code snippets
CSS
:root {
--overgrowth: #88cc33;
--overgrowth-rgb: 136 204 51;
--overgrowth-oklch: oklch(0.772 0.191 131);
}
.element {
color: var(--overgrowth);
background-color: hsl(87 60% 50%);
border-color: oklch(0.772 0.191 131);
}Tailwind CSS v4
@theme {
--color-overgrowth: #88cc33;
--color-overgrowth-50: #e0ffca;
--color-overgrowth-100: #cff6b5;
--color-overgrowth-200: #b4e690;
--color-overgrowth-300: #90cc60;
--color-overgrowth-400: #75b41f;
--color-overgrowth-500: #559d00;
--color-overgrowth-600: #498500;
--color-overgrowth-700: #3a6a00;
--color-overgrowth-800: #2d4e00;
--color-overgrowth-900: #1e3600;
--color-overgrowth-950: #0e2100;
}SCSS
$overgrowth: #88cc33;
$overgrowth-rgb: 136, 204, 51;
$overgrowth-light: mix(#fff, $overgrowth, 20%);
$overgrowth-dark: mix(#000, $overgrowth, 20%);
.element {
color: $overgrowth;
box-shadow: 0 0 0 2px rgba($overgrowth, 0.35);
}