ما هي عوامل تصفية CSS؟

تسمح لك مرشحات CSS بتطبيق تأثيرات رسومية مثل التمويه أو تغيير اللون إلى عنصر. يتم استخدامها بشكل شائع للصور والخلفيات والحدود.

يمكن استخدام المرشحات لإنشاء تأثيرات مرئية أو تحسين الصور أو إنشاء عناصر تصميم فريدة دون الحاجة إلى أدوات تحرير صور خارجية.

مرشح CSS المدعومة

• blur()- يطبق ضبابية غاوسية على العنصر.
• brightness()- يضبط سطوع العنصر.
• contrast()- يضبط تباين العنصر.
• grayscale()- يحول العنصر إلى تدرج الرمادي.
• hue-rotate()- يطبق دوران تدرج اللون على العنصر.
• invert()- يعكس ألوان العنصر.
• opacity()- يضبط عتامة العنصر.
• saturate()- يشبع العنصر أو يزيل تشبعه.
• sepia()- يحول العنصر إلى البني الداكن.

كيفية تطبيق عوامل التصفية

باستخدام كود CSS الذي تم إنشاؤه بواسطة هذه الأداة ، يمكنك تطبيق عوامل التصفية على أي عنصر HTML. إليك الطريقة:

.filtered-image { filter: blur(5px) brightness(110%) contrast(120%); }

filter: blur(2px) brightness(110%) contrast(120%) saturate(150%);

توافق

دعم عوامل تصفية CSS على نطاق واسع في المتصفحات الحديثة ، بما في ذلك Chrome و Firefox و Safari و Edge و Opera. ومع ذلك ، فإن المتصفحات القديمة مثل Internet Explorer لا تدعمها.