ग्रेडिएंट जनरेटर
CSS Gradient Generator दो या तीन रंगों से linear, radial और conic gradients बनाता है, लाइव प्रीव्यू और कॉपी के लिए तैयार background CSS के साथ।
इस टूल के बारे में
CSS Gradient Generator दो या तीन रंगों से linear, radial और conic gradients बनाता है, लाइव प्रीव्यू और कॉपी के लिए तैयार background CSS के साथ।
इस्तेमाल कैसे करें
- gradient type चुनें: linear, radial या conic।
- slider से angle सेट करें (0–360°)।
- दो रंग चुनें, या तीसरा रंग जोड़ने के लिए Use 3 colors पर टिक करें।
- Copy CSS पर क्लिक करें और background rule को अपनी stylesheet में पेस्ट करें।
जानने योग्य बातें
- linear-gradient() किसी angle से तय सीधी लाइन पर रंगों को मिलाता है, जहाँ 90deg बाएँ से दाएँ चलता है।
- radial-gradient(circle, …) रंगों को केंद्र से बाहर की ओर फैलाता है।
- conic-gradient(from <angle>, …) रंगों को एक केंद्र बिंदु के चारों ओर घुमाता है, जो pie charts और color wheels के लिए उपयोगी है।
- CSS gradients ब्राउज़र द्वारा रेंडर की गई इमेज हैं, इसलिए वे बिना अतिरिक्त फ़ाइल वज़न के किसी भी साइज़ में बड़े हो जाते हैं।
- तीनों gradient functions सभी मौजूदा प्रमुख ब्राउज़रों में सपोर्टेड हैं।
पूरी तरह आपके ब्राउज़र में चलता है — आप जो भी डालते हैं, वह न अपलोड होता है न सेव।
अक्सर पूछे जाने वाले सवाल
CSS gradient कैसे बनाएं?
gradient function को background के रूप में इस्तेमाल करें, जैसे background: linear-gradient(135deg, #1db954, #0a1628)। यह टूल आपके चुने रंगों और angle से यह लाइन आपके लिए लिख देता है।
linear, radial और conic gradients में क्या फ़र्क है?
linear gradients एक लाइन पर रंग बदलते हैं, radial gradients केंद्र बिंदु से फैलते हैं, और conic gradients घड़ी की सुइयों की तरह केंद्र के चारों ओर घूमते हैं।
क्या gradient में दो से ज़्यादा रंग हो सकते हैं?
हाँ। CSS gradients कितने भी color stops स्वीकार करते हैं। यह generator दो या तीन रंग सपोर्ट करता है; कॉपी किए गए CSS में आप हाथ से और stops जोड़ सकते हैं।
क्या CSS gradients वेबसाइट को धीमा करते हैं?
महसूस होने लायक नहीं। इन्हें ब्राउज़र बनाता है और कोई इमेज डाउनलोड नहीं होती, इसलिए ये आमतौर पर gradient इमेज फ़ाइलों से हल्के होते हैं।