🔲 CSS बॉक्स-छाया जेनरेटर
कुछ सेकंड में अपना CSS बॉक्स-शैडो वाला कोड प्राप्त करें - कोई इंस्टॉलेशन, कोई खाता, कोई इंटरनेट की आवश्यकता नहीं है। प्रत्येक शैडो लेयर के लिए ऑफसेट, ब्लर, स्प्रेड, रंग और ओपैकिटी के लिए स्लाइडर खींचें, लाइव प्रीव्यू तुरंत अपडेट होता रहे, फिर तैयार करें और तैयार CSS को कॉपी करें।
डिज़ाइन से ही निजी. यह टूल पूरी तरह आपके ब्राउज़र में चलता है — आपका डाला हुआ कुछ भी अपलोड या सेव नहीं होता, और यह ऑफ़लाइन भी काम करता है।
परिचय
यह उपकरण पूरी तरह से आपके ब्राउज़र में जावास्क्रिप्ट का उपयोग करके चलता है - आपके डिज़ाइन कभी भी आपके उपकरण से बाहर नहीं जाते। आप गहराई के प्रभाव, न्यूमोर्फिज्म, चमक प्रभाव या सूक्ष्म कार्ड उठाव बनाने के लिए कई छाया वर्गों को एक साथ रख सकते हैं। प्रत्येक वर्ग आंतरिक चमक या दबे हुए बटन दिखावट के लिए इनसेट छाया का समर्थन करता है। आउटपुट मानक सीएसएस होता है जिसे आप किसी भी शैली टैबलेट, फ्रेमवर्क या डिज़ाइन टोकन में सीधे डाल सकते हैं।
कैसे उपयोग करें
- क्लिक करें '+ छाया जोड़ें' अपनी पहली छाया वर्स्टर बनाने के लिए।
- छाया के प्रत्येक आकार के लिए ऑफसेट X, ऑफसेट Y, ब्लर, स्प्रेड और ऑपैकिटी स्लाइडर का उपयोग करें। 'इनसेट' को स्विच करें एक आंतरिक छाया प्रभाव के लिए।
- रंग चुनने के लिए स्वैच क्लिक करें और कोई भी छाया रंग चुनें। लाइव पूर्वावलोकन अपडेट करता रहता है जब आप हर नियंत्रण के समायोजन करते हैं।
- अधिक लेयर जोड़ें जटिल मल्टी-छाया प्रभावों के लिए जैसे न्यूमोर्फिज्म या स्टैक्ड ग्लोज।
- कॉपी CSS क्लिक करें ताकि आप पूरा box-shadow घोषणा कॉपी कर सकें और इसे अपने stylesheet में पेस्ट करें।
सामान्य प्रश्न
- क्या यह CSS बॉक्स-छाया जेनरेटर मुफ़्त है?
- हां, पूरी तरह से मुफ्त। कोई खाता, कोई परीक्षण अवधि, कोई छिपी हुई लागत - बस पेज खोलें और छायांकन शुरू करें।
- क्या यह ऑफलाइन, इंटरनेट कनेक्शन के बिना काम करता है?
- हां। यह उपकरण आपके ब्राउज़र में पूरी तरह से चलता है और किसी भी सर्वर कॉल के बिना। पृष्ठ लोड हो जाने के बाद, आप इंटरनेट से अपना कनेक्शन काट सकते हैं और यह बिना किसी समस्या के जारी रहेगा।
- मेरा डिज़ाइन डेटा निजी है? कोई चीज अपलोड होती है?
- कुछ भी अपलोड नहीं किया गया है। सभी शैडो सेटिंग्स आपके ब्राउज़र में स्थानीय रूप से प्रोसेस की जाती हैं और केवल आपके ब्राउज़र के localStorage में सहेजा जाता है। कभी भी कोई डेटा आपके डिवाइस से बाहर नहीं जाता।
- क्या मैं एक CSS नियम में एक से अधिक छायांकनों को लेयर कर सकता हूं?
- हां। '+ Add Shadow' पर जितनी बार आप चाहें क्लिक करें। यह उपकरण सभी लेयर्स को एक अल्पविराम विभाजित बॉक्स-छाया मान में संयोजित करता है - न्यूमोर्फिज्म, ग्लॉव प्रभाव या बहु-दिशात्मक गहराई के लिए आदर्श।
- कैसे एक अंतर्निहित (आंतरिक) छाया प्रभाव बनाएं?
- किसी भी छाया लेयर पर 'इनसेट' चेकबॉक्स को चेक करें। इनसेट छाया तत्व की सीमा के अंदर दिखाई देती है, जो दबे हुए बटन की स्थिति या आंतरिक ग्लॉव प्रभाव के लिए उपयोगी होती है। जनरेट किया गया CSS 'inset' की शब्दावली को स्वचालित रूप से शामिल करता है।
- क्या यह टूल मेरा डेटा अपलोड करता है?
- नहीं। सब कुछ आपके ब्राउज़र में ही चलता है, इसलिए आपका डेटा कभी आपके डिवाइस से बाहर नहीं जाता — पेज लोड होने के बाद यह ऑफ़लाइन भी काम करता है।