Light green is a cool-toned shade between turquoise and green on the color wheel. Its refreshing and calming qualities come from its green and subtle blue influence, which creates a sense of stability, peace, and rejuvenation.
Light green is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
- HEX code: #88E788
- RGB value: 53.3% red, 90.6% green, and 53.3% blue
Accessibility considerations play a crucial role in UX and UI design color choices. Figma offers plugins in the Community to make sure your designs meet Web Content Accessibility Guidelines.
Here are some ways to use light green in your designs:
- Provide visual feedback. Light green is the perfect color for success messages or hover effects that signal the completion of a task or goal within a platform. A checkbox, for example, can appear light green when a user clicks the element, promoting a sense of accomplishment.
- Encourage user action. Light green has a vibrancy that captures attention without being visually overpowering. Use it for primary CTAs, like “sign up,” “create account,” or “buy now” buttons to encourage users to click.
- Evoke a calming atmosphere. Incorporating light green into a UI’s color palette can promote peace and well-being, especially for health and wellness industries. It also works well in education and productivity apps that foster a calm and focused environment.
Keep in mind that color and its meaning can change from culture to culture—and at any given time. If you are designing for a global audience, research color considerations for your specific regions.
For variations within the same refreshing spectrum as light green, consider:
- Jade green (#00BB77) has a richer appearance, leaning more toward the blue region of the color wheel.
- Pastel green (#80EF80) shares a similar hue with a bit more vibrance.
- Mint green (#ADEBB3) brings a softer, lighter touch for a springtime vibe.
- Celadon (#A8DCAB) appears more muted with subtle gray undertones.
To complement light green, consider pairing it with:
- Orchid (#ED80E9) complements light green, offering a dynamic yet balanced color combination.
- White (#FFFFFF) creates a clean and modern look that allows light green to pop.
- Light yellow (#FFFFC5) offers a subtle contrast for a cheerful color pairing.
- Salmon (#FF7E70) adds energy to light green’s rejuvenating nature.
- Misty blue (#B5C7EB) contrasts light green with a calming complement.
Other colors worth considering include dark green for a cohesive and natural pairing, navy blue for a coastal vibe, and light gray for a simple yet sophisticated color scheme.
While light green is cool, it may clash with:
- Lime green (#89F336) has a vibrancy that may dull light green’s airy feel.
- Neon pink (#FF13F0) creates an extreme contrast, disrupting light green’s calm energy.
- Dark orange (#C76E00) has a warmth that may appear muddy next to light green’s coolness.
- Neon purple (#8A00C4) can create a jarring and unbalanced contrast next to light green.
Light green symbolizes new beginnings, growth, and optimism. It also carries connotations of peace and stability
In color psychology, light green evokes feelings of relaxation and rejuvenation. Its soft hue also promotes a sense of hope, uplifting one’s mood and encouraging a fresh start.
In UI design, light green provides enough contrast to capture a user’s attention without being visually overpowering. This makes it an ideal shade for primary CTAs or providing positive visual feedback.
Light green pigments have been used throughout history, using natural minerals like malachite, verdigris, and plant-based materials to produce the shade. Many believe the first recorded use of light green as a distinct color was as early as 700 A.D.
Throughout history, light green has been a symbol of growth and regeneration. In the modern era, it has been strongly associated with nature, sustainability, and environmentalism. Today, light green hues are used in a variety of applications, including UI design, graphic design, modern art, and fashion.
Color variations
Shades
Tints
Tones
Hues
Color Harmonies
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Custom Palettes
Evergreen
Spring Flowers
Fresh Start
- Large Text
Figma
- Normal Text
How you design, align, and build matters. Do it together with Figma.
1.52:1
WCAG 2.2 Simple Contrast
Normal Text
- Fail
- AA
- 4.5:1
- Fail
- AAA
- 7:1
Large Text
- Fail
- AA
- 3:1
- Fail
- AAA
- 4.5:1
- Large Text
Figma
- Normal Text
How you design, align, and build matters. Do it together with Figma.
13.83:1
WCAG 2.2 Simple Contrast
Normal Text
- Pass
- AA
- 4.5:1
- Pass
- AAA
- 7:1
Large Text
- Pass
- AA
- 3:1
- Pass
- AAA
- 4.5:1
Color simulations
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
The hexadecimal color #88E788, known as light green, has RGB values of R:136 G:231, B:136 and CMYK values of C:0.41, M:0, Y:0.41, K:0.09.
| VALUE | CSS | |
|---|---|---|
| HEX | 88E788 | #88E788 |
| RGB DECIMAL | 136, 231, 136 | RGB(136,231,136) |
| RGB PERCENTAGE | 53.3, 90.6, 53.3 | RGB(53.3%,90.6%,53.3%) |
| CMYK | 41, 0, 41, 9 | |
| HSL | 120°, 66.4, 72 | HSL(120°,66.4%,72%) |
| HSV (OR HSB) | 120°, 41.1, 90.6 | |
| WEB SAFE | 99FF99 | #99FF99 |
| CIE-LAB | 84.05, -46.903, 37.615 | |
| XYZ | 43.171, 64.161, 33.401 | |
| xyY | 0.307, 0.456, 64.161 | |
| CIE-LCH | 84.05, 60.123, 141.271 | |
| CIE-LUV | 84.05, -45.537, 58.86 | |
| HUNTER-LAB | 80.101, -43.972, 31.348 | |
| BINARY | 11110111, 11011001, 10111100 | |
| iOS - SwiftUI | Color(red: 0.533, green: 0.906, blue: 0.533) | |
| iOS - UIKit | UIColor(red: 0.533, green: 0.906, blue: 0.533, alpha: 1) | |
| Android - Compose | Color(0xFF88E788) |
