مولد مرشحات CSS
أداة مرئية لإنشاء ومعاينة خصائص مرشحات CSS.
إعدادات المرشحات
اضبط كل خاصية مرشح
القوالب المحددة مسبقاً
جرب أنماط المرشحات المحددة مسبقاً
معاينة
شاهد تأثيرات المرشحات المُنشأة على الصورة الافتراضية
الأصلية
مُرشحة
Filter Preview
كود CSS المُنشأ
filter: none;شرح دوال مرشحات CSS
التأثيرات البصرية
- • blur(px): تأثير التشويش
- • brightness(%): ضبط السطوع
- • contrast(%): ضبط التباين
- • opacity(%): ضبط الشفافية
تأثيرات الألوان
- • grayscale(%): تأثير رمادي
- • hue-rotate(deg): دوران اللون
- • invert(%): عكس الألوان
- • saturate(%): ضبط الإشباع
- • sepia(%): تأثير بني داكن
نصائح الاستخدام
- • ادمج مرشحات متعددة مفصولة بمسافات
- • طبق على أي عنصر HTML، ليس فقط الصور
- • استخدم مع رسوم CSS المتحركة للتأثيرات الديناميكية
- • استخدم backdrop-filter للتطبيق على الخلفيات فقط