सीएसएस वेरिएबल जनरेटर रंग, स्पेसिंग और टाइपोग्राफी के लिए सीएसएस कस्टम प्रॉपर्टीज (वेरिएबल्स) बनाएं।

सीएसएस कस्टम गुण -- उपसर्ग के साथ एक चयनकर्ता दायरे (आमतौर पर वैश्विक उपलब्धता के लिए :root) में परिभाषित किए जाते हैं: :root { --color-primary: #667eea; }। उन्हें var() के साथ एक्सेस किया जाता है: रंग: var(--color-primary)। वेरिएबल अन्य सीएसएस गुणों की तरह कैस्केड और विरासत में मिलते हैं - उन्हें :root में परिभाषित करने से वे हर जगह उपलब्ध हो जाते हैं। उन्हें किसी भी चयनकर्ता दायरे में, थीमिंग को सक्षम करते हुए, ओवरराइड किया जा सकता है: .dark-theme { --color-primary: #90cdf4; }। वेरिएबल अन्य वेरिएबल को संदर्भित कर सकते हैं: --color-hover: var(--color-primary)। थीमिंग के लिए, :root में सभी वेरिएबल परिभाषित करें और थीम वर्गों में ओवरराइड करें। जावास्क्रिप्ट वेरिएबल पढ़ और सेट कर सकता है: document.documentElement.style.setProperty('--color-primary', '#000')। प्रीप्रोसेसर वेरिएबल (सасс, लेस) के विपरीत, सीएसएस कस्टम गुण गतिशील हैं और रनटाइम पर बदले जा सकते हैं। वे सभी आधुनिक ब्राउज़रों में समर्थित हैं।