CSS Utilities
--color-chartreuse-green: #DFFF00;
.bg-chartreuse-green { background-color: #DFFF00; }
.text-chartreuse-green { color: #DFFF00; }Machine-readable data
Machine-Readable Color Data (JSON)
Perfect for CSS, design systems, automation, and AI ingestion.
hexCanonical HEX valuergbRed, green, blue channelshslHue, saturation, lightnesscmykApproximate print conversionwcagAA and AAA contrast optionsharmoniesMathematical harmony setsvariantsGenerated tone variantsnearestColorsKnowledge graph neighborsStructured sections
Color systems
{
"hex": "#DFFF00",
"rgb": [
223,
255,
0
],
"hsl": [
68,
100,
50
],
"cmyk": [
13,
0,
100,
0
],
"luminance": 0.8721,
"contrast": {
"black": 18.44,
"white": 1.14
}
}WCAG
{
"AA": [
"#000000",
"#1A1A1A",
"#36454F"
],
"AAA": [
"#000000",
"#1A1A1A",
"#36454F"
]
}Harmonies
{
"complementary": "#2200FF",
"analogous": [
"#FFA200",
"#5EFF00"
],
"triadic": [
"#00DDFF",
"#FF00DD"
],
"tetradic": [
"#00FFA2",
"#2200FF",
"#FF005D"
],
"splitComplementary": [
"#005EFF",
"#A200FF"
],
"monochromatic": [
"#E9FF5C",
"#DFFF00",
"#8DA300"
]
}Variants
{
"light": "#E9FF5C",
"dark": "#8DA300",
"saturated": "#DDFF00",
"desaturated": "#C8E31C",
"pastel": "#E7F589",
"neon": "#E2FF29"
}Pairings
{
"best": [
"#000000",
"#2200FF",
"#FFA200",
"#5EFF00"
],
"avoid": [
"#C8E31C",
"#E9FF5C"
],
"neutral": [
"#1A1A1A",
"#F5F5F5",
"#E8E8E4"
],
"highContrast": [
"#000000"
],
"lowContrast": [
"#E9FF5C",
"#C8E31C"
]
}Knowledge graph
{
"nearestColors": [
"electric-lime",
"yellow",
"lemon",
"cadmium-yellow",
"canary-yellow"
],
"generatedPalettes": [
"chartreuse-green"
],
"generatedComparisons": [
"chartreuse-green-vs-electric-lime",
"chartreuse-green-vs-yellow"
],
"relatedFamilies": [
"/colors/by-family/yellow",
"/colors/by-temperature/warm",
"/colors/by-tone/vibrant"
],
"relatedTools": [
"/harmonies/chartreuse-green",
"/wcag/chartreuse-green",
"/css/colors/chartreuse-green",
"/hex/dfff00"
],
"semanticRelations": {
"broader": [
"/colors/by-family/yellow",
"/colors/by-temperature/warm",
"/colors/by-tone/vibrant"
],
"narrower": [
"/palettes/chartreuse-green"
],
"related": [
"/colors/electric-lime",
"/colors/yellow",
"/colors/lemon",
"/colors/cadmium-yellow",
"/colors/canary-yellow",
"/compare/chartreuse-green-vs-electric-lime",
"/compare/chartreuse-green-vs-yellow",
"/harmonies/chartreuse-green",
"/wcag/chartreuse-green",
"/css/colors/chartreuse-green",
"/hex/dfff00"
]
}
}Full JSON dataset
{
"slug": "chartreuse-green",
"name": "Chartreuse Green",
"hex": "#DFFF00",
"uses": [
"natural palettes",
"wellness branding",
"sustainability design"
],
"psychology": {
"associations": [
"nature",
"growth",
"balance"
],
"contexts": [
"wellness",
"outdoor brands",
"gardening",
"organic products"
],
"avoidIn": [
"urgent error states"
]
},
"aliases": [],
"sourceType": "curated",
"confidence": "medium",
"reviewStatus": "manual",
"sourceUrl": "https://www.colorsencyclopedia.com/assets/colors.json",
"origin": {
"type": "common",
"notes": "Curated common color reference used in design and editorial color systems."
},
"family": "yellow",
"temperature": "warm",
"tone": [
"vibrant"
],
"editorialNotes": "Curated internal color record with computed technical properties.",
"tags": [
"yellow",
"warm",
"vibrant",
"natural-palettes",
"wellness-branding",
"sustainability-design",
"nature",
"growth",
"balance"
],
"popularity": 84,
"rgb": [
223,
255,
0
],
"hsl": [
68,
100,
50
],
"cmyk": [
13,
0,
100,
0
],
"luminance": 0.8721,
"contrast": {
"black": 18.44,
"white": 1.14
},
"harmonies": {
"complementary": "#2200FF",
"analogous": [
"#FFA200",
"#5EFF00"
],
"triadic": [
"#00DDFF",
"#FF00DD"
],
"tetradic": [
"#00FFA2",
"#2200FF",
"#FF005D"
],
"splitComplementary": [
"#005EFF",
"#A200FF"
],
"monochromatic": [
"#E9FF5C",
"#DFFF00",
"#8DA300"
]
},
"variants": {
"light": "#E9FF5C",
"dark": "#8DA300",
"saturated": "#DDFF00",
"desaturated": "#C8E31C",
"pastel": "#E7F589",
"neon": "#E2FF29"
},
"wcag": {
"AA": [
"#000000",
"#1A1A1A",
"#36454F"
],
"AAA": [
"#000000",
"#1A1A1A",
"#36454F"
]
},
"css": {
"variable": "--color-chartreuse-green: #DFFF00;",
"utility": ".bg-chartreuse-green { background-color: #DFFF00; }",
"textUtility": ".text-chartreuse-green { color: #DFFF00; }"
},
"nearestColors": [
"electric-lime",
"yellow",
"lemon",
"cadmium-yellow",
"canary-yellow"
],
"generatedPalettes": [
"chartreuse-green"
],
"generatedComparisons": [
"chartreuse-green-vs-electric-lime",
"chartreuse-green-vs-yellow"
],
"relatedFamilies": [
"/colors/by-family/yellow",
"/colors/by-temperature/warm",
"/colors/by-tone/vibrant"
],
"relatedTools": [
"/harmonies/chartreuse-green",
"/wcag/chartreuse-green",
"/css/colors/chartreuse-green",
"/hex/dfff00"
],
"semanticRelations": {
"broader": [
"/colors/by-family/yellow",
"/colors/by-temperature/warm",
"/colors/by-tone/vibrant"
],
"narrower": [
"/palettes/chartreuse-green"
],
"related": [
"/colors/electric-lime",
"/colors/yellow",
"/colors/lemon",
"/colors/cadmium-yellow",
"/colors/canary-yellow",
"/compare/chartreuse-green-vs-electric-lime",
"/compare/chartreuse-green-vs-yellow",
"/harmonies/chartreuse-green",
"/wcag/chartreuse-green",
"/css/colors/chartreuse-green",
"/hex/dfff00"
]
},
"pairings": {
"best": [
"#000000",
"#2200FF",
"#FFA200",
"#5EFF00"
],
"avoid": [
"#C8E31C",
"#E9FF5C"
],
"neutral": [
"#1A1A1A",
"#F5F5F5",
"#E8E8E4"
],
"highContrast": [
"#000000"
],
"lowContrast": [
"#E9FF5C",
"#C8E31C"
]
}
}
Color meaning and use
About Chartreuse Green Color
Chartreuse Green sits in the yellow family with warm temperature and vibrant visual character. Chartreuse Green is a commonly used color name in design references, palettes, and editorial color systems.
Its common associations include nature, growth, and balance, which makes it relevant for wellness and outdoor brands. In design work, Chartreuse Green is most useful for natural palettes, wellness branding, and sustainability design, especially when paired with black text for stronger contrast.
WCAG Accessibility
Contrast checks for Chartreuse Green against black and white text.