مرشّحات الصور
جديداضبط السطوع والتباين والتشبّع والضبابية وغيرها، ثم نزّل الصورة.
filter: none; Runs entirely in your browser. Nothing is uploaded.
طبّق فلاتر الصور وتعديلاتها مباشرةً في متصفحك
يتيح لك محرر فلاتر الصور هذا إعادة تصميم أي صورة في ثوانٍ — أسقط صورةً، انقر على إعداد مسبق أو حرّك أشرطة التمرير وشاهد النتيجة تتحدث لحظياً. يجمع بين محرر بصري وفلاتر CSS حقيقية، فتحصل على صورة قابلة للتنزيل وكذلك كود filter: الدقيق خلفها. لا شيء يُنصَّب، ولا حساب يُنشأ، ولا حدود لحجم الملف. يعمل مع أي تنسيق صور: JPG, PNG, WebP, GIF.
على خلاف المحررات الثقيلة التي تستلزم اشتراكاً، كل شيء هنا يعمل محلياً على canvas HTML. لا تُرفع صورتك إلى أي خادم أبداً، مما يجعله وسيلةً سريعةً وخاصةً لتعديل الصور أو تحسينها قبل مشاركتها. الإصدار المجاني من Fotor يضيف علامة مائية للتنزيلات. يتطلب PicMonkey خطةً مدفوعةً للوصول الكامل إلى الفلاتر بـ 12.99 $/شهر. UtiloKit لا علامة مائية فيه ولا جدار دفع — افتح الصفحة وابدأ التحرير.
المجموعة الكاملة من تعديلات فلاتر CSS
تسعة تعديلات تغطي المجموعة الكاملة من وظائف CSS filter: السطوع, التباين, التشبع, التدرج الرمادي, سيبيا, تدوير الصبغة, العكس, الضبابية, والشفافية. السطوع والتباين والتشبع جميعها تتمحور حول 100% مما يسهّل ضبط الصورة دون مبالغة، بينما hue-rotate (0–360°) ينقل كل لون حول عجلة الألوان — مفيد لضبط ألوان صور المنتجات أو إنشاء مظهر ملوّن إبداعي دون لمس أداة تصميم.
كدّس أي تركيبة وسيعكسها المعاينة فوراً. اسحب مقبض المقارنة قبل/بعد لرؤية الفرق في أي وقت. تعرض الأداة إعلان CSS الدقيق يتحدث أثناء عملك، فتتعلم أي الوظائف تُنتج أي تأثيرات بمجرد اللعب بأشرطة التمرير. لا توجد أداة فلاتر مجانية أخرى تجمع بين معاينة الصورة الحية وإخراج كود CSS الحي.
إعدادات مسبقة على طراز إنستغرام بنقرة واحدة
تحوّل معرض الإعدادات المسبقة تركيبات أشرطة التمرير إلى مظاهر مسمّاة: حيوي, دافئ, بارد, أبيض وأسود, نوار, فينتاج, باهت, سيبيا والمزيد. تعرض كل صورة مصغّرة التأثير على صورتك الشخصية لترى الخيارات وتختار المظهر قبل تأكيده. هذه هي أنواع فلاتر إنستغرام ذاتها التي يفرض VSCO وLightroom Mobile رسوم اشتراك عليها، مُعادةً البناء من وظائف فلاتر CSS بسيطة دون أي تكلفة.
انقر على إعداد مسبق لتطبيقه، ثم أجرِ ضبطاً دقيقاً بالأشرطة لتجعله خاصاً بك. CSS الأساسي دائماً مرئي، لذا إن كنت تبني نظام تصميم يمكنك نسخ القيم الدقيقة وإعادة إنشاء المظهر في أي مشروع ويب. تحويل الإعداد Vintage إلى أسلوبك الخاص المسمّى يستغرق نحو 30 ثانية.
انسخ كود CSS للفلاتر — واستخدمه في أي مكان
يعكس كل تعديل نفسه كإعلان CSS حي: filter: brightness(105%) contrast(115%) saturate(140%);. انقر على نسخ CSS وألصقه مباشرةً في ورقة الأنماط. يعمل على عناصر img, video, خلفيات div, وعناصر SVG — أي شيء تدعمه خاصية CSS filter. تُحذف القيم الافتراضية تلقائياً لتبقى الشيفرة مختصرةً وقابلةً للقراءة.
تعرض معظم مولدات فلاتر CSS صورة معاينة عامة. هذه الأداة تطبّق الفلتر على صورتك الشخصية لترى بالضبط كيف ستبدو في السياق. أضف transition: filter 0.3s; للحصول على حركة تمرير سلسة. الكود جاهز للإنتاج: لا يلزم بادئة، ومدعوم في Chrome وEdge وFirefox وSafari وجميع المتصفحات المحمولة الكبرى منذ 2016.
كيف تعمل فلاتر الصور فعلاً — ولماذا لا حاجة للرفع
فلتر الصور هو تحويل للبيكسلات. يمر المتصفح على كل بيكسل ويعيد كتابة قيم RGB الخاصة به: grayscale(100%) يُدمجها في رمادي واحد بحساب المتوسط, sepia() يُدفّئ درجات اللون نحو البني-البرتقالي, invert() يقلب القيم إلى سلبي, وblur() يحسب متوسط كل بيكسل مع جيرانه باستخدام نواة غاوسية. هذه العمليات الحسابية رخيصة بما يكفي للتشغيل بسرعة 60fps على GPU، لهذا تبدو المعاينة فورية.
لأن كل شيء يعمل على canvas HTML في متصفحك، لا تغادر صورتك جهازك أبداً. رفع صورة إلى خدمة كـ LunaPI أو Pixlr أو حتى Google Photos يعني أن صورتك تجلس على خادم بعيد للمعالجة. تُلغي هذه الأداة تلك الخطوة كلياً — الضبط والمعاينة والتنزيل تحدث جميعها محلياً. لمن يتعامل مع صور شخصية أو وثائق حساسة، هذا فارق مهم.
مقارنة مع المنافسين — أدوات فلاتر الصور المجانية
تقدم أدوات معروفة عدة فلاتر صور أونلاين، كل منها له مقايضاته. Fotor لديه مكتبة إعدادات مسبقة قوية لكنه يقيّد التنزيلات عالية الجودة ويضيف علامات مائية على الخطة المجانية. يتطلب PicMonkey اشتراكاً بـ 12.99 $/شهر للوصول إلى معظم الفلاتر ويستلزم دائماً تسجيل دخول. Pixlr E محرر صور متكامل يتعامل مع الفلاتر جيداً لكنه يرفع صورتك إلى خوادمه. يتضمن Canva فلاتر في محرر الصور لكنه يستلزم حساباً ويخزّن الملفات في سحابة Canva.
UtiloKit Image Filters لا يفعل أياً من ذلك. لا رفع، لا حساب، لا علامة مائية، لا حد يومي. تحصل أيضاً على إخراج كود CSS — شيء لا تقدمه أي من تلك الأدوات — مما يجعل هذه الأداة الوحيدة المجانية التي تعمل بالقدر ذاته للمصممين الذين يحررون الصور وللمطورين الذين يطابقون الأنماط البصرية في الكود.
Frequently asked questions
كيف تعمل فلاتر الصور؟
تعمل فلاتر الصور بتحويل لون كل بيكسل في الوقت الحقيقي. يطبّق كل فلتر عملية رياضية صغيرة على القنوات الحمراء والخضراء والزرقاء لكل بيكسل: brightness(150%) يضربها في 1.5 لإضاءة الصورة، وgrayscale(100%) يحسب متوسطها في نغمة رمادية واحدة، وblur(4px) يمزج كل بيكسل مع جيرانه باستخدام نواة الالتفاف. لأن هذا يعمل على GPU عبر HTML canvas API، تتحدث المعاينة في اللحظة ذاتها التي تسحب فيها شريط التمرير.
ما أنواع فلاتر الصور المتاحة؟
ثمة مجموعتان رئيسيتان. فلاتر التعديل تغيّر النبرة واللون مع إبقاء الصورة تبدو طبيعية — السطوع والتباين والتشبع وتدوير الصبغة. فلاتر التأثير تعيد تصميم الصورة إلى مظهر مميز — التدرج الرمادي (أبيض وأسود)، وسيبيا (فينتاج دافئ)، والعكس (سلبي)، والضبابية (تركيز ناعم)، والشفافية. يمنحك هذا المحرر جميع وظائف فلاتر CSS التسع.
كيف أضيف فلتراً على صورة أونلاين مجاناً؟
أسقط صورةً في المربع أعلاه (أو انقر للاستعراض، أو الصق بـ Ctrl/Cmd+V)، ثم انقر على صورة مصغّرة للإعداد المسبق أو اسحب أشرطة التعديل. تتحدث المعاينة لحظياً ومقبض المقارنة قبل/بعد يتيح لك مقارنتها بالأصل في أي وقت. حين تُعجبك النتيجة، انقر على تنزيل PNG أو تنزيل JPG للحفظ بالدقة الكاملة. لا شيء يُرفع — كل خطوة تعمل في متصفحك.
ما خاصية CSS filter وكيف أُولّدها؟
تطبّق خاصية CSS filter تأثيرات رسومية على أي عنصر HTML باستخدام سلسلة من وظائف الفلتر: brightness() وcontrast() وsaturate() وgrayscale() وsepia() وhue-rotate() وinvert() وblur() وopacity(). مثلاً، filter: contrast(120%) saturate(140%) sepia(15%); يعطي مظهراً حيوياً ودافئاً قليلاً. تبني هذه الأداة تلك السلسلة الدقيقة أثناء تحريكك للأشرطة لتنسخها مباشرةً في ورقة الأنماط.
كيف أطبّق فلاتر على طراز إنستغرام بدون إنستغرام؟
فلاتر إنستغرام هي تركيبات مسبقة من وظائف فلاتر CSS الأساسية. مظهر يشبه Clarendon هو تقريباً contrast(120%) saturate(135%)، ومظهر الفيلم الباهت يستخدم contrast(85%) brightness(110%) sepia(12%)، ونغمة Vivid الحيوية تتضافر contrast(130%) saturate(160%). انقر على أي صورة مصغّرة في المعرض لتطبيقها فوراً على صورتك، ثم أجرِ تعديلاً على الأشرطة الفردية لدفع المظهر أبعد.
كيف أجعل صورة أبيض وأسود أو سيبيا أو فينتاج أونلاين؟
للأبيض والأسود، اضبط التدرج الرمادي على 100% — الإعداد المسبق B&W يفعل ذلك بنقرة واحدة، وNoir يضيف تبايناً إضافياً لأثر درامي. للسيبيا، ارفع شريط السيبيا؛ sepia(80%) يعطي طباعةً كلاسيكيةً بنبرة بنية. للمظهر الفينتاج، ادمجهما: يستخدم الإعداد Vintage sepia(55%) contrast(108%) brightness(104%) saturate(120%) لإحساس بفيلم دافئ خفيف الغسيل. يعمل هذا كله في متصفحك تماماً، بلا حساب وبلا رفع.
هل من الآمن استخدام أداة فلاتر صور أونلاين؟
يعتمد على الأداة. كثير من المحررات أونلاين — Fotor وLunaPI وPixlr — ترفع صورتك إلى خوادمها للمعالجة، مما يعني أن صورتك تجلس على جهاز شخص آخر وقد تُحتجز لأغراض التحليل أو تدريب النماذج. يعمل فلتر صور UtiloKit كلياً على canvas HTML داخل متصفحك: صورتك تُقرأ محلياً وتُعالج محلياً وتُنزَّل محلياً — لا تُرفع أبداً ولا تُخزَّن أبداً ولا يراها أحد غيرك.
Related tools
عرض كل الأدوات
جديد تدوير وقلب الصور
دوّر بخطوات 90° واقلب الصورة أفقيًا أو رأسيًا.
جديد تحويل PNG إلى ICO
حوّل صورة إلى أيقونة موقع ICO متعددة الدقّات داخل متصفحك.
جديد عارض ومزيل EXIF
اطّلع على البيانات الوصفية المخفية للصورة — الكاميرا والتاريخ وGPS — واحذفها لحماية خصوصيتك.
جديد تحويل PDF إلى JPG
حوّل صفحات PDF إلى صور JPG أو PNG أو WebP بالجودة التي تختارها — كل ذلك داخل متصفحك.
جديد صانع الميمز
اصنع ميمز بنص علوي/سفلي كلاسيكي أو مربعات نص قابلة للسحب — بلا علامة مائية وبلا تسجيل.
جديد Image to Text (OCR)
Extract text from any image, screenshot or photo — free online OCR that runs entirely in your browser, no upload required.