Langkau ke kandungan utama

Pemotong Imej percuma

Potong imej dengan seret-untuk-pilih, kekangan nisbah aspek pilihan (1:1, 16:9, 4:3, dll.), grid peraturan-pertiga, dan eksport berbilang format (JPEG, PNG, WebP).

Berfungsi luar talian selepas dimuatkan

Lepaskan fail di sini, atau klik untuk semak imbas

JPG, PNG, WebP, HEIC, HEIF · diproses pada peranti anda

atau tekan Ctrl+V untuk menampal daripada papan keratan

Layar fail

Petua: anda boleh menampal tangkapan skrin dengan Ctrl+V

Fail anda tidak pernah meninggalkan peranti. Semua pemprosesan berlaku secara tempatan dalam pelayar anda.

Kegunaan biasa

  • Pangkas foto untuk InstagramPangkas kepada nisbah aspek pilihan Instagram: 1:1 (segi empat), 4:5 (potret) dan 1.91:1 (landskap).
  • Pangkas foto profil menjadi segi empatBuat foto profil segi empat untuk LinkedIn, Twitter, GitHub atau mana-mana platform sosial.
  • Pangkas imej kecil YouTube dan artikelPangkas kepada nisbah aspek 16:9 yang digunakan oleh video YouTube dan kebanyakan foto blog pahlawan.
  • Pangkas foto pasport / IDPangkas foto kepada nisbah potret 2:3 standard untuk pasport, visa dan permohonan ID.
  • Pangkas foto produk e-dagangStandardkan nisbah aspek foto produk untuk Amazon, Shopify, Etsy dan pasaran lain.

Cara ia berfungsi

Pemotongan berlaku sepenuhnya dalam pelayar anda menggunakan HTML5 Canvas API — tiada muat naik, tiada pelayan. Anda seret kawasan pilihan terus pada elemen kanvas, dan apabila anda kenakan pemotongan, enjin pemaparan 2D terbina dalam pelayar membaca hanya piksel dipilih dan mengekod semula kepada JPEG, PNG, atau WebP.

  1. 1
    Imej dimuatkan ke dalam memori
    Fail anda dibaca dengan URL.createObjectURL(), yang menyerahkan pelayar URL blob tempatan. HTMLImageElement menyahkod fail sepenuhnya dalam tab pelayar — bait imej tidak pernah keluar dari peranti anda.
  2. 2
    Pointer Events menggerakkan pilihan pemotongan
    Pointer Events API pelayar (yang menyatukan input tetikus, sentuh, dan pen) menjejaki seretan pada lapisan kanvas. Menekan di luar pilihan memulakan segi empat baharu; menekan di dalam menggerakkannya; menekan berhampiran sudut bawah-kanan mengubah saiznya. Prasetel nisbah-aspek pilihan (1:1, 16:9, 4:3, dll.) mengekang geometri semasa menyeret.
  3. 3
    Canvas melukis pratonton langsung
    Pada setiap perubahan pemotongan, konteks Canvas 2D melukis semula imej, mengenakan lapisan gelap di luar pilihan, mengosongkan kawasan potongan untuk menunjukkan imej asal pada ketepatan penuh, dan mempertindihkan grid peraturan-per-tiga dan pemegang ubah saiz teal.
  4. 4
    toBlob() mengekod dan menyampaikan hasil
    Apabila anda klik Potong, kanvas luar-skrin baharu dicipta pada dimensi potongan tepat. ctx.drawImage() menyalin hanya segi empat dipilih, dan canvas.toBlob() mengekod hasilnya menggunakan pengekod JPEG, PNG, atau WebP asli pelayar pada tetapan kualiti pilihan anda. Output diserahkan semula sebagai URL blob tempatan untuk muat turun.

Imej anda dibuka sebagai URL blob tempatan dan diproses sepenuhnya dalam tab pelayar anda — tiada apa dimuat naik ke mana-mana pelayan pada mana-mana titik.

Alat berkaitan

Soalan lazim