Using Chartreuse in design
HEX
#7FFF00
RGB
127, 255, 0
HSL
90°, 100%, 50%
HSV
90°, 100%, 100%
Chartreuse is the liqueur color spilled across modernism — half lemon, half leaf, all attitude. #7FFF00 is the yellow-green that refuses to behave like a background; it slices through neutrals and dates any palette to a deliberate choice. Say the word and designers think avant-garde, not pasture.
Best for
Product launches, promotional banners, and e-commerce storefronts.
Compare with
Accessibility
Check contrast before using chartreuse for text-heavy layouts, especially on low-contrast backgrounds.
How does chartreuse compare to nearby colors?
What is the difference between chartreuse and kelly green?
Chartreuse (#7FFF00) looks cleaner and more charged than Kelly Green (#4CBB17) when the two are shown together. Chartreuse is more useful when the color itself needs to do some signaling; Kelly Green is easier to keep in longer-running surfaces. Begin with chartreuse when the family needs its current undertone and surface character; keep kelly green for the nearby alternative that shifts the mood without leaving the same hue neighborhood.
What color is chartreuse?
The name references Chartreuse, the French herbal liqueur made by Carthusian monks. It became a design shorthand for vivid yellow-green in art and fashion history.
What is the hex code for chartreuse?
| Format | Value |
|---|---|
| HEX | #7FFF00 |
| RGB | rgb(127, 255, 0) |
| HSL | hsl(90°, 100%, 50%) |
| HSV / HSB | hsv(90°, 100%, 100%) |
| CMYK (approx.) | cmyk(50%, 0%, 100%, 0%) |
Convert Chartreuse to other color formats
Open the color converter with Chartreuse (#7FFF00) prefilled to copy RGB, HSL, HSV, CMYK, or OKLCH values.
Convert Chartreuse in the color converter →What does chartreuse mean in design?
Chartreuse is often associated with bold creativity, irony, and high-contrast experimentation. Compared with lime green it tends to read as even more acidic and art-directed; beside neon green it usually feels slightly less fluorescent while still aggressively bright.
How do I use chartreuse in code?
| CSS (hex) | color: #7FFF00; |
| CSS (rgb) | color: rgb(127, 255, 0); |
| CSS (hsl) | color: hsl(90, 100%, 50%); |
| RGB % | rgb(50%, 100%, 0%) |
| Tailwind | text-[#7FFF00] |
| SwiftUI | Color(red: 0.498, green: 1.000, blue: 0.000) |
| UIKit | UIColor(red: 0.498, green: 1.000, blue: 0.000, alpha: 1.0) |
| Android | Color.rgb(127, 255, 0) |
| Compose | Color(0xFF7FFF00) |
| Web Safe | #66FF00 |
Is chartreuse accessible?
| Combination | Ratio | AA | AA lg | AAA | AAA lg | UI |
|---|---|---|---|---|---|---|
| AaWhite text on this color | 1.3:1 | ✗ | ✗ | ✗ | ✗ | ✗ |
| AaBlack text on this color | 16.21:1 | ✓ | ✓ | ✓ | ✓ | ✓ |
| AaThis color as text on white | 1.3:1 | ✗ | ✗ | ✗ | ✗ | ✗ |
| AaThis color as text on black | 16.21:1 | ✓ | ✓ | ✓ | ✓ | ✓ |
WCAG 2.1: AA normal ≥ 4.5:1, AA large text ≥ 3:1, AAA normal ≥ 7:1, AAA large ≥ 4.5:1, UI components ≥ 3:1.
How does chartreuse look with color blindness?
Simulated appearance for common types of color vision deficiency. Actual perception varies by individual.
What colors go with chartreuse
Charcoal turns chartreuse from purely energetic into something more adult and controlled by adding depth without another hue fight.
Gold warms chartreuse enough to keep the palette from feeling chilly or overly technical, while still reading intentional rather than decorative-for-its-own-sake.
With a vivid chartreuse, cream is gentler than white, so the palette keeps warmth and avoids looking overlit.
What colors clash with chartreuse
With chartreuse, Neon Green pushes the work toward novelty or screen-effect territory faster than most brand or editorial systems can tolerate.
Magenta pushes chartreuse toward a nightclub or cosmetic register that is hard to square with calmer editorial or product work.
How should I use chartreuse in design?
- •Chartreuse has the saturation to lead a brand palette — strong enough for buttons, headers, and packaging without drifting into pastel or dark territory.
- •Pair chartreuse with warm accents (gold, rust, amber) when you need more energy, or stay in cool territory (navy, silver, sage) for a composed, professional look.
- •Chartreuse's high saturation makes it most effective in small doses — buttons, chart highlights, notification badges, and social media accents.
What are good chartreuse palettes?
Design with chartreuse in Moda
Create a presentation or document using chartreuse as your accent color. Moda's AI applies your color palette automatically.
Create a design with chartreuse →What are the shades and tints of chartreuse?
Shades (darker)
Tints (lighter)
Tones (desaturated)
Hue variations
What are the color harmonies for chartreuse?
Harmonies are calculated from the base swatch. When a harmony matches a named color page, it links there; otherwise it appears here as a computed reference swatch.
Similar colors
Neon Green
Neon Green keeps roughly the same visual weight as chartreuse but changes the undertone story, which is often enough to move a palette from warmer and tactile to cooler and more technical, or the reverse.
Kelly Green
Kelly Green is almost the same hue as chartreuse; the real difference is value, with kelly green feeling more grounded and anchor-ready.
Lime Green
Lime Green is useful when chartreuse is the right weight but the wrong mood: the swap changes temperature and finish more than contrast.
Pistachio
Pistachio is almost the same hue as chartreuse; the real difference is value, with pistachio feeling more open and surface-friendly.
Avocado
Avocado is close enough to chartreuse to keep the palette cohesive, yet the lighter-darker shift still decides whether the family behaves more like atmosphere or more like structure.
Frequently asked questions
What is the hex code for chartreuse?
The hex code for chartreuse is #7FFF00. In RGB, that's 127 red, 255 green, and 0 blue. The approximate CMYK equivalent is 50% cyan, 0% magenta, 100% yellow, and 0% key (black).
Is chartreuse a warm or cool color?
Chartreuse leans cool but is not icy, so it can stay composed with blues and greens or feel more balanced when warmed up with cream, tan, or muted gold.
Should chartreuse lead the palette or stay in supporting roles?
Chartreuse has enough chroma to take the lead, but it usually performs best when the surrounding system stays quieter. Treat it as the voice of emphasis, not the answer to every layout need.
Where does chartreuse work best in a layout?
Chartreuse carries a lot of chroma, so it is usually strongest as punctuation rather than wallpaper. Use it for focal accents and let low-saturation surfaces do the balancing.
Is chartreuse accessible?
Chartreuse works better with dark text than white text. Black text reaches 16.21:1 contrast on the swatch, which makes the color more usable as a background or highlight surface than as a dark panel.
More green colors
Keep exploring color resources
All color pages
Browse the full library of color references, pairings, and palettes.
Green colors
Compare chartreuse with other green tones.
Blue colors
Explore nearby color families to build stronger palettes and contrasts.
Brown colors
Explore nearby color families to build stronger palettes and contrasts.
Neutral colors
Explore nearby color families to build stronger palettes and contrasts.
Last updated April 6, 2026
Color values are computed from the listed hex code using standard conversion formulas. RGB, HSL, and HSV are exact screen-ready conversions. CMYK is an approximate on-screen reference, not a press-ready print specification. Pairings, palettes, and use-case guidance are heuristic recommendations derived from color relationships, contrast behavior, and common presentation, document, and UI patterns.