تغيير حجم الصورة مجانًا

كيف يعمل

يتم تغيير الحجم بالكامل في متصفحك باستخدام Canvas API — محرك العرض نفسه المدمج في Chrome وFirefox وSafari. تُرسم صورتك على لوحة خارج الشاشة بالأبعاد الجديدة وتُعاد ترميزها محليًا؛ ولا يغادر شيء جهازك.

1. 1
   المتصفح يفك الصورة

   عند إفلات ملف أو اختياره، يفك المتصفح الصورة (JPEG أو PNG أو WebP أو AVIF أو GIF) إلى بيانات بكسل خام عبر HTMLImageElement. تُقرأ أبعاد البكسل الأصلية وتُستخدم لتعبئة حقلي العرض والارتفاع مسبقًا.
2. 2
   Canvas يعيد الرسم بالحجم الجديد

   النقر على «تغيير الحجم» يضبط HTMLCanvasElement خارج الشاشة على العرض والارتفاع اللذين اخترتهما، ثم يستدعي ctx.drawImage() لتحجيم كل بكسل ورسمه بالأبعاد الجديدة. ولإخراج JPEG، تُطبق تعبئة خلفية بيضاء أولًا حتى لا تصبح المناطق الشفافة سوداء.
3. 3
   canvas.toBlob() يرمّز الإخراج

   يرمّز canvas.toBlob() المدمج في المتصفح بيانات البكسل إلى JPEG أو PNG أو WebP بمستوى الجودة الذي تضبطه. إذا حددت حجم ملف مستهدفًا، يضبط بحث ثنائي من 7 تكرارات معامل الجودة تلقائيًا حتى يصبح الإخراج بذلك الحجم أو أقل.
4. 4
   معاينة النتيجة وتنزيلها محليًا

   يُحوَّل Blob المرمَّز إلى رابط كائن للوحة المعاينة — دون ذهاب وإياب إلى خادم. والنقر على التنزيل يطلق حفظًا محليًا باسم ملف يتضمن أبعاد البكسل النهائية.

أدوات ذات صلة