Pikka Logo Pikka
Chrome App
Electric High-Visibility Lime-Green Category: Green

Chartreuse (#7FFF00) — Color Codes, Meaning & UI Palettes

Chartreuse (#7FFF00) is a vivid yellow-green named after the legendary French herbal liqueur distilled by Carthusian Monks since 1737. It embodies electric vibrancy, youth culture, avant-garde design, and energetic rebellion.

Quick Answer (Chartreuse Color Code): The exact HEX code for Chartreuse is #7FFF00. In RGB, it is rgb(127, 255, 0). In HSL, it is hsl(90deg, 100%, 50%), and its print CMYK formulation is cmyk(50%, 0%, 100%, 0%). It has a relative luminance of 0.76 and pairs best in UI design with Deep Obsidian (#09090B) and Electric Cyan (#06B6D4).
Click to Copy HEX
Chartreuse
#7FFF00
HEX
#7FFF00
RGB
rgb(127, 255, 0)
HSL
hsl(90deg, 100%, 50%)
CMYK (Print)
cmyk(50%, 0%, 100%, 0%)
Apple Display P3
color(display-p3 0.498 1.000 0.000)

WCAG 2.1 Accessibility & Contrast Rating

White Text (#FFFFFF) 1.3:1 (Fail)
Black Text (#000000) 16.2:1 (AAA)

11-Step Tints & Shades Scale (Tailwind 50–950)

Mathematically balanced luminance scale for design tokens and CSS color palettes. Click any shade to copy hex code:

50
#F5FFEB
100
#EBFFD6
200
#D6FFAD
300
#BDFF7A
400
#9EFF3D
500
#7FFF00
600
#69D100
700
#53A600
800
#3D7A00
900
#295200
950
#172E00

Color Harmonies & Palette Schemes

Complementary

#7F00FF
Opposite 180° Contrast

Analogous -30°

#FFFF00
Natural Harmony

Analogous +30°

#00FF00
Natural Harmony

Triadic +120°

#007FFF
120° Balanced Triad

Triadic +240°

#FF0080
120° Balanced Triad

Curated UI Design Pairings for Chartreuse

Viral accent color, live notification indicator, and high-impact badge for Gen-Z apps, Web3 interfaces, and dark-mode music streaming apps.

Deep Obsidian
#09090B
Ultra-High Contrast Dark Mode
Electric Cyan
#06B6D4
Futuristic Cyber Accent
Pure Black
#000000
Sharp Punchy Iconography
Acid Lime Tint
#F7FEE7
High-Visibility Warning Box

Export Chartreuse Code Snippets

CSS Variable --color-chartreuse-color: #7FFF00;
Tailwind Config 'chartreuse-color': '#7FFF00'
Swift / SwiftUI Color(hex: "#7FFF00")
JSON Design Token {"name": "Chartreuse", "hex": "#7FFF00"}

Frequently Asked Questions About Chartreuse (#7FFF00)

What is the exact HEX code for Chartreuse?

The exact HEX code for Chartreuse is #7FFF00. In 8-digit hexadecimal (with 100% opacity), it is #7FFF00FF. Its RGB decimal equivalent is rgb(127, 255, 0) and its HSL value is hsl(90deg, 100%, 50%).

What colors go best with Chartreuse in UI and web design?

Chartreuse pairs exceptionally well with Deep Obsidian (#09090B), Electric Cyan (#06B6D4), Pure Black (#000000), and Acid Lime Tint (#F7FEE7).

How do I use Chartreuse in CSS and Tailwind CSS?

In standard CSS, apply it directly via color: #7FFF00; or background-color: #7FFF00;. In Tailwind CSS, use arbitrary value syntax like bg-[#7fff00] or text-[#7fff00], or define it in your Tailwind v4 @theme block as --color-chartreuse-color: #7FFF00;.

Is Chartreuse WCAG accessible for readable text?

Against a pure white background (#FFFFFF), Chartreuse achieves a contrast ratio of 1.3:1 (Fail). Against a pure black background (#000000), it achieves 16.2:1 (AAA). Check custom contrast pairings on Pikka's WCAG Contrast Checker.

Explore More Colors in the Dictionary

Browse our complete catalog of curated named colors, harmonic palettes, and accessible UI combinations.

Named Color Dictionary Interactive Color Wheel Tint & Shade Generator