A quick guide to light greens
Light greens fall into three groups, and they behave quite differently in a design:
- Soft light greens have moderate saturation. They suit backgrounds, packaging and gentle illustrations.
- Vivid light greens are bright and energetic, close to apple or kiwi. Use them as accents or for success states.
- Yellow-leaning greens such as pistachio and celery feel warm and natural.
The CSS keywords
lightgreen (#90EE90) and palegreen (#98FB98) are nearly identical, both bright and slightly minty. honeydew (#F0FFF0) is almost white. greenyellow, lawngreen and chartreuse are much more intense and can be tiring in large areas.
Using these shades in interfaces
It is a common choice for success messages and "available" badges. Pair a pale background with a dark green text color from the same family rather than black; it reads well and keeps the meaning clear. Always add a label or icon too, since people with red-green color vision deficiencies may not see the hue difference.
Related shades
For cooler greens, see mint green; for vivid yellow-greens, lime green; and for very pale versions, pastel green. Light greens also feature in the spring colors collection.