Figma color wheel
Want to find the perfect complementary or analogous colors to match Grass Green?
Grass green is a lively, refreshing color that represents Nature's vitality. Nestled between yellow and blue on the color wheel, it has a bright, lush hue. Related shades include emerald and lime. Use grass green in designs to evoke freshness and growth, perfect for eco-friendly themes. 🌿
Color variations
Shades
Tints
Tones
Hues
Color harmonies
Complementary
Split
Monochromatic
Analogous
Triadic
Square
Custom palettes
Pixel Orchard
Limeberry Burst
Green Breeze
Grass Green is defined by the following color codes and values to ensure consistency across various digital platforms and devices.
- Hex Code: #7CFC00
- RGB value: 48.6% red, 98.8% green, 0.0% 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
For variations within the same spectrum as grass green, consider:
- Lime Green (#89f336): Lime Green shares a vibrant and fresh quality with Grass Green, revealing the lively and bright hue reminiscent of freshly sprouted grass.
- Avocado Green (#568203): Like Grass Green, Avocado Green embodies an earthy, natural vibe with its warm undertones—making it feel as grounded as flourishing foliage.
- Kelly Green (#4cbb17): Kelly Green captures the vivid brightness of Grass Green, offering a similar cheerful and natural essence that highlights the lively nature of a grassy landscape.
- Emerald (#50C878): Emerald shares a lushness akin to Grass Green, with its deep and rich tone that evokes the vitality and vibrancy found in natural environments.
To complement Grass Green, consider pairing it with:
- Coral (#FF8559): Coral introduces a lively contrast that emphasizes the freshness of Grass Green, highlighting their natural harmony.
- Cream (#FDFBD4): Cream serves as a soft, neutral backdrop, enhancing the earthy tones of Grass Green for a calming, balanced palette.
- Turquoise (#40E0D0): Turquoise adds a refreshing twist, offering a vibrant partner that accentuates the lively nature of Grass Green.
- Chocolate (#713600): Chocolate provides a rich, warm contrast, grounding Grass Green with an earthy sophistication.
- Peach (#FFD3AC): Peach adds a gentle warmth, complementing the vitality of Grass Green and creating a fresh, inviting combination.
While Grass Green is refreshing and vibrant, it may clash with:
- Cerise (#DE3163): Cerise can create an intense clash due to its bold and lively hue, conflicting with Grass Green’s natural earthiness.
- Vermilion (#E73121): Vermilion, with its warm and fiery shade, competes with the freshness of Grass Green, leading to a jarring visual contrast.
- Ruby (#E0115F): Ruby's deep and intense tone might overshadow Grass Green’s brightness, resulting in a discordant pairing.
- Neon Pink (#FF13F0): Neon Pink’s electrifying vibrancy overwhelms Grass Green's more grounded aesthetic, creating an unsettling contrast.
- Tangerine (#FFA800): Tangerine’s warm and bold tone can overpower Grass Green’s cool undertones, disrupting the color balance.
Contrast checker
Contrast 1.33
- Large Text
#7CFC00
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Fail | Fail | |
Fail | Fail | |
Fail | Fail |
Contrast 15.78
- Large Text
#7CFC00
- Normal Text
How you design, align, and build matters. Do it together with Figma.
| Category | ||
|---|---|---|
Pass | Pass | |
Pass | Pass | |
Pass | Pass |
Color simulations
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
The hexadecimal color #7CFC00, known as Grass Green, has RGB values of R:124, G:252, B:0 and CMYK values of C:51, M:0, Y:100, K:1.
| VALUE | CSS | |
|---|---|---|
| HEX | #7CFC00 | #7CFC00 |
| RGB DECIMAL | 124, 252, 0 | RGB(124,252,0) |
| RGB PERCENTAGE | 48.6, 98.8, 0.0 | RGB(48.6%,98.8%,0.0%) |
| CMYK | 51, 0, 100, 1 | |
| HSL | HSL(90.5, 100.0%, 49.4%) | HSL(90.5, 100.0%, 49.4%) |
| HSV (OR HSB) | 90.5°, 100.0, 98.8 | |
| WEB SAFE | #1022550 | #1022550 |
| BINARY | 01111100, 11111100, 00000000 | |
| iOS - SwiftUI | Color(red: 0.486, green: 0.988, blue: 0.000) | |
| iOS - UIKit | UIColor(red: 0.486, green: 0.988, blue: 0.000, alpha: 1) | |
| Android - Compose | Color(0xFF7CFC00) |
