🎚️CSS फ़िल्टर जेनरेटर

फ़िल्टर फ़ंक्शन और इकाई

CSS का फ़िल्टर प्रॉपर्टी, छवि या तत्व की उपस्थिति में प्रभाव लागू करने वाली प्रॉपर्टी है। blur या sepia जैसे फ़ंक्शन को आधे-चौड़ाई स्पेस से अलग करके लिखा जाता है।

• px (पिक्सेल)：blur फ़ंक्शन धुंधलापन की त्रिज्या को px में निर्दिष्ट करता है। 4px निर्दिष्ट करने पर 4 पिक्सेल की त्रिज्या में रंग मिलते हैं।
• % (प्रतिशत)：brightness फ़ंक्शन या sepia फ़ंक्शन प्रभाव की शक्ति को % में निर्दिष्ट करते हैं। brightness फ़ंक्शन में 100% मूल चमक है, 120% बीस प्रतिशत उज्ज्वल अवस्था है।
• deg (डिग्री)：hue-rotate फ़ंक्शन रंग पहिया पर रंग को घुमाने का कोण deg में निर्दिष्ट करता है। 180deg निर्दिष्ट करने पर रंग विपरीत पक्ष के रंग में चला जाता है।

लेखन क्रम से परिणाम क्यों बदलते हैं

फ़िल्टर में दिए गए फ़ंक्शन बाएं से दाएं लागू होते हैं, और पिछले प्रभाव के परिणाम पर अगला प्रभाव लागू होता है, इसलिए लेखन क्रम बदलने से उपस्थिति भी बदल सकती है। उदाहरण के लिए, पहले सफेद-काला करके फिर सेपिया लागू करने पर भूरापन बना रहता है, लेकिन पहले सेपिया लागू करके फिर सफेद-काला करने पर भूरापन हट जाता है। इस टूल में आवेदन क्रम निर्धारित है, लेकिन उत्पन्न CSS कोड को संपादित करके क्रम बदल सकते हैं।

backdrop-filter से अंतर

फ़िल्टर और backdrop-filter एक ही फ़ंक्शन का उपयोग कर सकते हैं, लेकिन प्रभाव लागू करने का लक्ष्य भिन्न है।

• filter：फ़िल्टर निर्दिष्ट तत्व स्वयं (छवि या पाठ आदि) की उपस्थिति में प्रभाव लागू करने वाली प्रॉपर्टी है।
• backdrop-filter：backdrop-filter निर्दिष्ट तत्व के पीछे दिखाई देने वाले भाग में प्रभाव लागू करने वाली प्रॉपर्टी है, जिसका उपयोग फ्रॉस्टेड ग्लास जैसे प्रभाव के लिए किया जाता है।