Glassmorphism जनरेटर

इस टूल के बारे में

Glassmorphism Generator CSS backdrop-filter से frosted-glass effect बनाता है, और लाइव प्रीव्यू के साथ blur, background opacity, saturation, border opacity, radius और tint रंग एडजस्ट करने देता है।

इस्तेमाल कैसे करें

1. glass का tint रंग चुनें।
2. blur, opacity और saturation एडजस्ट करें।
3. border opacity और border radius सेट करें।
4. Copy CSS पर क्लिक करें।

जानने योग्य बातें

• यह effect backdrop-filter: blur() saturate() इस्तेमाल करता है, जो element के पीछे की हर चीज़ को धुंधला करता है।
• अर्ध-पारदर्शी background (rgba) ज़रूरी है, वरना blur छिप जाता है।
• बने हुए CSS में Safari के लिए -webkit-backdrop-filter prefix शामिल है।
• glass effect रंगीन या इमेज वाले backgrounds पर सबसे अच्छा दिखता है; सादे रंगों पर blur दिखाई नहीं देता।
• टेक्स्ट contrast पर नज़र रखें — भीड़-भाड़ वाले backgrounds पर पारभासी panels WCAG contrast से नीचे जा सकते हैं।

पूरी तरह आपके ब्राउज़र में चलता है — आप जो भी डालते हैं, वह न अपलोड होता है न सेव।

अक्सर पूछे जाने वाले सवाल