CSS ग्रेडिएंट जनरेटर

यह CSS ग्रेडिएंट जनरेटर आपके नियंत्रित रंग स्टॉप से लीनियर और रेडियल ग्रेडिएंट बनाता है, साथ में लाइव पूर्वावलोकन और चिपकाने के लिए तैयार पृष्ठभूमि घोषणा देता है। स्टॉप को पट्टी पर खींचें, कोण या आकार तय करें और CSS तुरंत बदल जाती है।

सब कुछ आपके चुने रंगों और सेटिंग्स से ब्राउज़र में चलता है, इसलिए कुछ भी अपलोड नहीं होता। परिणाम कॉपी करके ऑफ़लाइन भी इस्तेमाल किया जा सकता है।

लीनियर ग्रेडिएंट रंगों को सीधी रेखा में मिलाता है और कोण दिशा तय करता है: 0 डिग्री ऊपर, 90 डिग्री दाएं और 180 डिग्री नीचे होता है। रेडियल ग्रेडिएंट केंद्र से बाहर की ओर वृत्त या दीर्घवृत्त में मिलता है।

दोनों मानक CSS मान हैं, जिन्हें लीनियर-ग्रेडिएंट() और रेडियल-ग्रेडिएंट() लिखा जाता है। दोनों रंग स्टॉप की वही सूची इस्तेमाल करते हैं, इसलिए प्रकार बदलने पर रंग बने रहते हैं और केवल उनका फैलाव बदलता है।

हर रंग स्टॉप 0% से 100% तक किसी स्थान पर रखा रंग है। ग्रेडिएंट पड़ोसी स्टॉप के बीच सहज रूप से मिलता है, इसलिए स्टॉप का स्थान तय करता है कि रंग कहां सबसे प्रबल होगा और अगले रंग में कितनी तेजी से बदलेगा।

कई रंगों वाला ग्रेडिएंट बनाने के लिए जितने चाहें स्टॉप जोड़ें, मिश्रण ठीक करने के लिए उन्हें खींचें या इच्छित स्थान पर नया स्टॉप रखने के लिए पट्टी पर क्लिक करें। कम से कम दो स्टॉप जरूरी हैं।

बना हुआ कोड कॉपी करें और किसी भाग, कार्ड या बटन जैसे एलिमेंट के पृष्ठभूमि में चिपकाएं। आधुनिक ब्राउज़र लीनियर-ग्रेडिएंट और रेडियल-ग्रेडिएंट को विक्रेता प्रीफ़िक्स के बिना समर्थन करते हैं, इसलिए मान सीधे काम करती है।

ग्रेडिएंट केवल एक मान है, इसलिए इसे वहां भी इस्तेमाल किया जा सकता है जहां पृष्ठभूमि इमेज अपेक्षित हो। वैकल्पिक के लिए ठोस रंग के ऊपर परत करें या एकसमान रूप के लिए वही स्टॉप लीनियर और रेडियल दोनों संस्करण में दोबारा इस्तेमाल करें।