Cắt

Cắt ảnh Cắt ảnh tròn

Tối ưu hóa

Nén ảnh Tăng Độ Phân Giải AI Xóa nền ảnh

Chỉnh sửa

Thay đổi kích thước ảnh

Chuyển đổi

Khác

Ảnh sang PDF

Cắt ảnh online theo tỷ lệ bất kỳ

Cắt JPG, PNG, WebP hoặc AVIF theo tỷ lệ 1:1, 16:9, 9:16, 4:5, 3:2, 4:3 hoặc nhập pixel tùy chỉnh.

hoặc thả ảnh vào đây

Giới thiệu công cụ này

Cắt bất kỳ ảnh nào thành vùng chọn hình chữ nhật ngay trong trình duyệt của bạn, sử dụng cropperjs v2. Tải lên tệp JPG, PNG, WebP hoặc AVIF và khung cắt mở ra ngay lập tức. Kéo các góc để định vị vùng chọn, khóa tỷ lệ khung hình (1:1, 16:9, 9:16, 4:5, 3:2, 4:3 hoặc A4), hoặc nhập chính xác chiều rộng và chiều cao theo pixel rồi khung sẽ tự điều chỉnh. Số liệu trực tiếp hiển thị kích thước đầu ra theo pixel thực của ảnh gốc trước khi bạn tải xuống. Ảnh của bạn luôn ở trên thiết bị, tab Mạng trong DevTools không ghi nhận bất kỳ yêu cầu tải ảnh nào ra ngoài trong quá trình cắt. PNG và WebP giữ nguyên kênh alpha từ tệp gốc, JPEG thay thế vùng trong suốt bằng nền trắng. Công cụ này phù hợp cho bất kỳ ai cần cắt ảnh chữ nhật chính xác, nhanh chóng mà không cần cài đặt phần mềm, mỗi lần một tệp.

Cắt ảnh
Cách công cụ cắt ảnh hoạt động trong trình duyệt

Cách công cụ cắt ảnh hoạt động trong trình duyệt

Ảnh được trình duyệt mở trực tiếp bằng File API. Không có upload tới máy chủ và không có bản sao tạm thời nào lưu ngoài thiết bị của bạn. Kéo khung cắt tới vị trí mong muốn, đổi kích thước từ góc hoặc cạnh, số liệu pixel trực tiếp cập nhật theo từng thao tác. Tọa độ tính theo không gian pixel của ảnh gốc, vì vậy con số hiển thị chính là kích thước thực của tệp đầu ra. Mở DevTools và chuyển sang tab Mạng trong khi cắt, không có yêu cầu ảnh nào ra ngoài. Tệp bạn thả vào và tệp bạn tải về đều ở lại hoàn toàn trên thiết bị suốt phiên làm việc.

Cắt ảnh
Khóa tỷ lệ hoặc nhập kích thước pixel chính xác

Khóa tỷ lệ hoặc nhập kích thước pixel chính xác

Nhấp vào chip tỷ lệ (1:1 cho vuông, 16:9 cho ngang rộng, 9:16 cho dọc, 4:5, 3:2, 4:3 hoặc A4) và khung chọn sẽ khóa theo tỷ lệ đó. Kéo nó tới vị trí bất kỳ trên ảnh để chọn phần cần giữ. Để đạt mục tiêu pixel cụ thể, nhập chiều rộng và chiều cao vào các trường kích thước, khung cắt sẽ tự điều chỉnh để khớp. Đầu ra luôn bằng kích thước pixel gốc của vùng chọn. Công cụ này không phóng to: nếu vùng chọn rộng 600 pixel, tệp đầu ra cũng rộng 600 pixel.

Cắt ảnh
Đầu ra JPG thay thế vùng trong suốt bằng nền trắng

Đầu ra JPG thay thế vùng trong suốt bằng nền trắng

Nếu tệp gốc có vùng trong suốt (PNG, WebP có kênh alpha hoặc AVIF có kênh alpha) và bạn chọn JPG làm định dạng đầu ra, các pixel trong suốt sẽ được lấp đầy bằng màu trắng. JPG không có kênh alpha, vì vậy không có chỗ để lưu thông tin trong suốt. Để giữ lại trong suốt, chọn PNG, WebP hoặc AVIF trong bộ chọn định dạng ở màn hình hoàn tất. PNG và WebP truyền nguyên kênh alpha gốc không thay đổi. AVIF cũng hỗ trợ alpha. Bộ chọn định dạng gắn nhãn từng tùy chọn để bạn nhìn thấy sự đánh đổi trước khi tải xuống.

Cắt ảnh
Di chuyển vùng chọn chính xác bằng bàn phím

Di chuyển vùng chọn chính xác bằng bàn phím

Nhấn Tab để chuyển tới khung cắt, sau đó dùng phím mũi tên để di chuyển vùng chọn từng pixel một. Giữ Shift cùng với mũi tên thì bước nhảy tăng lên mười pixel. Phương thức điều khiển bằng bàn phím này được tích hợp sẵn trong cropperjs v2 như chức năng gốc, không phải lớp khả năng tiếp cận thêm vào sau. Hữu ích khi bạn cần căn chỉnh trực quan dưới pixel mà bàn di chuột không làm được, hoặc khi làm việc chỉ với bàn phím. Vùng chọn cũng phản hồi cảm ứng trên di động, chụm để phóng to khung vẽ rồi kéo các góc vùng chọn để định khung lại. Cả hai trường hợp đều không cần bật thêm chế độ nào.

Cắt ảnh
Định dạng đầu ra: PNG, JPG, WebP và AVIF

Định dạng đầu ra: PNG, JPG, WebP và AVIF

Sau khi cắt, chọn định dạng tải xuống trên màn hình hoàn tất. PNG không mất dữ liệu và giữ nguyên trong suốt. JPG áp dụng nén có mất dữ liệu ở chất lượng 0.9 theo mặc định, gần như không phân biệt được với ảnh gốc trong hầu hết ảnh chụp. WebP cân bằng giữa chế độ không mất và có mất dữ liệu, đồng thời hỗ trợ trong suốt. AVIF được mã hóa qua thư viện @jsquash/avif ở chất lượng 0.9. Cho tệp nhỏ nhất ở chất lượng hình ảnh tương đương, nhưng lần mã hóa AVIF đầu tiên trong phiên cần tải về mô-đun WASM 870 KB một lần duy nhất. Định dạng đầu ra mặc định khớp với đầu vào, PNG vào PNG ra, JPG vào JPG ra. Bạn có thể đổi bất cứ lúc nào ở màn hình hoàn tất.

Cắt ảnh
Khi nào nên dùng một công cụ cắt khác

Khi nào nên dùng một công cụ cắt khác

Công cụ này chỉ cắt hình chữ nhật, vuông, các tỷ lệ ngang, dọc và kích thước pixel tùy chỉnh. Để cắt ảnh tròn, ví dụ ảnh đại diện với góc trong suốt, hãy dùng Circle Crop. Nó dùng chung quy trình xử lý phía trình duyệt nhưng cho ra PNG tròn. Đối với các kích thước mặc định theo nền tảng (Instagram 1080×1080, hình thu nhỏ YouTube 1280×720, ảnh bìa Facebook 1200×630), các trang đặt sẵn trong nhóm Crop sẽ mở với các kích thước đó được nạp sẵn, bạn không phải tính toán. Nếu chỉ cần đổi định dạng mà không cắt trước, dùng công cụ Convert để chuyển sang PNG, JPG, WebP hoặc AVIF.

Cách cắt ảnh thành hình tròn

  1. Tải ảnh lên

    Kéo thả tệp JPG, PNG, WebP hoặc AVIF vào trang, hoặc nhấp để chọn từ thiết bị của bạn. Khung cắt mở ngay lập tức.

  2. Chọn tỷ lệ hoặc kích thước

    Nhấp vào chip tỷ lệ (1:1, 16:9, 9:16, 4:5, 3:2, 4:3 hoặc A4) để khóa tỷ lệ, hoặc nhập chiều rộng và chiều cao theo pixel vào các trường tương ứng.

  3. Điều chỉnh vùng chọn

    Kéo góc hoặc cạnh để định vị vùng cần giữ, số liệu trực tiếp hiển thị kích thước đầu ra chính xác trước khi tải xuống.

  4. Lưu ảnh đã cắt

    Nhấp vào nút Tải xuống, chọn định dạng (PNG, JPG, WebP hoặc AVIF) trên màn hình hoàn tất rồi lưu tệp về thiết bị.

Câu hỏi thường gặp

Công cụ cắt ảnh có những tỷ lệ đặt sẵn nào?

Công cụ cung cấp các tỷ lệ 1:1 (hình vuông), 4:3, 3:2, 16:9 (màn hình rộng), 9:16 (dọc), 4:5 và A4. Bạn cũng có thể nhập chính xác chiều rộng và chiều cao theo pixel để có kích thước tùy chỉnh. Tỷ lệ được đặt trực tiếp trên phần tử vùng chọn của cropperjs v2, giúp khóa tỷ lệ khung hình khi bạn kéo. Đặt về NaN để thoát khỏi chế độ khóa.

Làm sao để cắt ảnh cho Instagram?

Sử dụng chip tỷ lệ 1:1 cho ảnh vuông (1080×1080) hoặc 4:5 cho ảnh dọc (1080×1350), đây là hai định dạng phổ biến nhất của Instagram. Nhập 1080 vào trường chiều rộng để ảnh đầu ra đạt đúng kích thước pixel, với điều kiện ảnh gốc phải có độ phân giải tối thiểu bằng vùng chọn. Công cụ không phóng to ảnh, nếu vùng chọn nhỏ hơn 1080 pixel thì tệp đầu ra sẽ có kích thước thực tế của vùng chọn đó.

Tôi có thể cắt ảnh theo kích thước tùy chỉnh không?

Có. Nhập giá trị chiều rộng và chiều cao theo pixel vào các trường kích thước và khung cắt sẽ tự động điều chỉnh. Kích thước đầu ra bằng đúng kích thước vùng chọn theo pixel của ảnh gốc, không qua phóng to hay thu nhỏ. Số liệu trực tiếp hiển thị kích thước thực tế để bạn xác nhận trước khi tải xuống.

Tôi có thể cắt trực tuyến những định dạng ảnh nào?

Công cụ nhận JPG, PNG, WebP và AVIF, bốn định dạng được tất cả trình duyệt hiện đại hỗ trợ từ năm 2022. GIF chỉ xử lý khung đầu tiên. HEIC, TIFF, BMP và SVG không được hỗ trợ. Đầu ra có thể là PNG, JPG, WebP hoặc AVIF theo lựa chọn của bạn, định dạng mặc định khớp với định dạng đầu vào.

Việc cắt có làm giảm chất lượng ảnh không?

Không khi xuất sang PNG hoặc WebP không mất dữ liệu. Khi xuất sang JPG hoặc WebP có mất dữ liệu, chất lượng mặc định được đặt ở 0.9, trực quan gần như không phân biệt được với ảnh gốc. AVIF được mã hóa ở chất lượng tương đương qua thư viện @jsquash/avif. Dữ liệu EXIF bị xóa ở mọi định dạng xuất.

Tôi có thể xoay ảnh khi đang cắt không?

Không, công cụ cắt ảnh này chỉ hỗ trợ cắt hình chữ nhật mà không xoay. Chức năng xoay ảnh sẽ nằm trong một công cụ riêng biệt khi được phát triển. Nếu bạn cần xoay trước khi cắt, hãy xoay ảnh bằng ứng dụng khác rồi tải tệp đã xoay lên công cụ này để cắt theo tỷ lệ mong muốn.

Chi tiết

Ghi chú từ đội ngũ về tay nghề, định dạng và những quyết định nhỏ đằng sau một bản cắt tròn tốt.

Cropperjs v2 so với v1, sự khác biệt về kiến trúc
Công cụ này được xây dựng trên cropperjs phiên bản 2.1.1, bản viết lại hoàn toàn so với thư viện gốc. Bản v2 thay thế API kiểu hàm tạo cũ (new Cropper(img, { aspectRatio: 1 })) bằng kiến trúc Web Components. Khung vẽ cắt, lớp phủ vùng chọn và phần tử ảnh đều là các phần tử HTML tùy chỉnh được đăng ký qua CustomElementRegistry của trình duyệt. Điều đó có nghĩa Shadow DOM xử lý mọi kiểu nội bộ, không cần tệp cropper.css riêng, giảm một yêu cầu tài nguyên Vite so với v1. Khóa tỷ lệ giờ được đặt trực tiếp trên phần tử vùng chọn (cropperSelection.aspectRatio = 1) thay vì trong hàm tạo, nên có thể đổi tỷ lệ tại thời gian chạy mà không cần khởi tạo lại toàn bộ giao diện cắt. Thư viện nặng 41 960 byte thô và 12 175 byte sau khi nén gzip, đo trực tiếp từ tiêu đề content-length của CDN jsDelivr. 12 KB đó trả một lần mỗi phiên và được tái sử dụng trên mọi trang cắt nhờ chia chunk Vite.
Tọa độ vùng chọn trong không gian pixel ảnh gốc
Khi bạn kéo vùng chọn cắt trên màn hình, tọa độ bạn thấy nằm trong không gian pixel ảnh gốc, không phải không gian pixel CSS. Sự khác biệt này quan trọng đối với màn hình mật độ điểm ảnh cao, một điện thoại có tỷ lệ pixel thiết bị 3× hiển thị ảnh rộng 300 pixel CSS thành 900 pixel thực, nhưng tọa độ vùng chọn phản ánh 900 pixel thực, không phải 300 CSS. Tệp đầu ra bạn tải xuống chứa chính xác số pixel mà hình chữ nhật vùng chọn đại diện trong ảnh gốc. Thao tác cắt gọi selection.$toCanvas() từ API cropperjs v2, một phương thức bất đồng bộ trả về HTMLCanvasElement mới có kích thước bằng kích thước pixel của vùng chọn. Khung vẽ này sau đó được truyền tới canvas.toBlob() cho PNG, JPG hoặc WebP, hoặc tới bộ mã hóa @jsquash/avif cho AVIF. Không có bước phóng to nào được chèn vào. Nếu vùng chọn rộng 800 pixel, đầu ra rộng 800 pixel.
Hiệu suất mã hóa trên các trình duyệt
Thời gian mã hóa kế thừa từ pipeline convert cùng dùng canvas.toBlob, PNG khoảng 20 ms, JPG khoảng 15 ms, WebP khoảng 70 ms, AVIF khoảng 250 ms sau khi đã làm nóng. AVIF lần đầu tải thêm chunk @jsquash/avif khoảng 870 KB gzip, dùng chung với công cụ Convert trong cùng phiên. AVIF trên Firefox chậm hơn khoảng 4 lần so với Chromium trên cùng ảnh đầu vào (cùng phát hiện như xác minh E2E của Convert, docs/research/convert-e2e-2026-05-16.md). Với ảnh rộng 4000 pixel như ảnh chụp lớn, mã hóa lần đầu có thể mất vài giây. Nếu không cần AVIF, PNG hoặc WebP nhanh hơn. Nếu cần tệp nhỏ nhất ở cùng chất lượng, AVIF là lựa chọn phù hợp.
Xử lý kênh alpha và định dạng đầu ra
PNG, WebP và AVIF có kênh alpha nên giữ nguyên vùng trong suốt từ ảnh gốc tới đầu ra. JPG không có kênh alpha nên các pixel trong suốt bị thay thế bằng màu trắng. Đây là hành vi của canvas.toBlob. Ảnh PNG chuyển sang JPG sẽ giảm kích thước tệp nhưng mất trong suốt. Ảnh JPG, AVIF hoặc WebP chuyển sang PNG sẽ tăng kích thước tệp, ví dụ JPG 17 KB có thể trở thành PNG khoảng 105 KB ở 1024×768. Dữ liệu EXIF, IPTC, XMP và ICC bị xóa hoàn toàn qua pipeline canvas, đây là thực tế kỹ thuật chứ không phải tính năng tùy chọn. Bộ chọn định dạng ở màn hình hoàn tất gắn nhãn từng tùy chọn để bạn nhìn thấy sự đánh đổi trước khi quyết định tải xuống.
Bảo mật dữ liệu, quy trình xử lý hoàn toàn trên thiết bị
Mô tả từng bước: File API đọc tệp thành Blob, bộ giải mã ảnh của trình duyệt giải mã, phần tử cropper-canvas hiển thị, phần tử cropper-selection quản lý vùng chọn (không có mạng), selection.$toCanvas() chạy trong bộ nhớ, canvas.toBlob hoặc @jsquash/avif WASM trong Worker mã hóa, object URL được tạo, thẻ download kích hoạt lưu tệp. Toàn bộ chuỗi này diễn ra trên thiết bị, không có yêu cầu mạng ảnh nào. Cloudflare Analytics chỉ thu thập page view và Web Vitals, không thu thập nội dung tệp. Giới hạn kích thước đầu vào khoảng 25 MB trên Safari di động và khoảng 100 MB trên máy tính, vượt quá có thể khiến trang bị treo do hết bộ nhớ JavaScript.
Khi nào nên dùng công cụ khác trong gia đình Crop
Circle Crop tại /circle-crop/ dùng cropperjs v1.6.2 cho ảnh tròn với góc trong suốt, đầu ra là PNG tròn. Các trang đặt sẵn cho Instagram, Facebook, YouTube, Twitter, LinkedIn mở với kích thước mặc định đã được nạp sẵn để bạn không phải tính toán mỗi lần. Nếu chỉ cần đổi định dạng mà không cắt, dùng công cụ Convert, hỗ trợ PNG, JPG, WebP, AVIF. Nếu cần đổi kích thước theo pixel mà giữ toàn bộ ảnh, dùng công cụ Resize. Nếu cần giảm dung lượng tệp sau khi cắt, dùng công cụ Compress, áp dụng thuật toán nén sharp và libvips trên máy chủ để đạt tỷ lệ nén tốt hơn so với canvas.toBlob trong trình duyệt.