§

Kéo ảnh vào hoặc nhấp để chọn

PNG, JPEG, WebP, GIF, BMP — tối đa 30 MB mỗi tệp. Hỗ trợ hàng loạt.

Kéo nhiều ảnh để xử lý hàng loạt — tất cả thao tác thực hiện trên thiết bị của bạn.

Giới hạn chiều rộng hoặc chiều cao dài hơn; tỷ lệ khung hình được giữ nguyên.
Cấu hình sẵn

Cổng dịch vụ công VNeID, Cổng dịch vụ công quốc gia và nhiều hệ thống nộp hồ sơ trực tuyến tại Việt Nam yêu cầu ảnh chân dung phải đúng kích thước — thường là 400×600 hoặc 3×4 cm quy đổi sang pixel theo độ phân giải DPI quy định. Các cửa hàng trên Shopee Việt Nam, Lazada Việt Nam và TikTok Shop Việt Nam đều có yêu cầu nghiêm ngặt về kích thước ảnh sản phẩm. Các freelancer và công ty thiết kế tại Hà Nội, TP. Hồ Chí Minh và Đà Nẵng thường xuyên xử lý hàng loạt ảnh trước khi giao cho khách hàng. Vì công cụ này chạy hoàn toàn trong JavaScript và không gửi ảnh lên máy chủ bên ngoài, nó đáp ứng yêu cầu của Luật An ninh mạng và Nghị định bảo vệ dữ liệu cá nhân.

Cách thay đổi kích thước ảnh trên trình duyệt hoạt động

Mỗi lần thay đổi kích thước là một quy trình ngắn chạy hoàn toàn trong JavaScript. Không có thư viện codec nào được tải xuống và không có máy chủ nào liên quan. Canvas API tích hợp của trình duyệt giải mã tệp, vẽ lại ở kích thước mục tiêu và mã hóa lại trong bộ nhớ, rồi đưa ra một Blob mà trang có thể xem trước hoặc nén lại. Vì mỗi bước đều nằm trong sandbox của tab, các tệp gốc không bao giờ đến được mạng.

  1. Đọc từng tệp đã tải lên dưới dạng Blob và tạo URL đối tượng để trình duyệt có thể giải mã cục bộ, không sao chép byte lên máy chủ hay ghi vào đĩa.
  2. Tính kích thước mục tiêu từ chế độ bạn chọn — giới hạn cạnh dài nhất, chiều rộng và chiều cao chính xác, hoặc chia tỷ lệ phần trăm. Khóa tỷ lệ khung hình giữ nguyên tỷ lệ khi chỉnh sửa một trường.
  3. Tạo Canvas ngoài màn hình ở kích thước mục tiêu và gọi ctx.drawImage(source, 0, 0, width, height) để vẽ lại các pixel đã giải mã. Trình duyệt xử lý phép nội suy làm mịn kết quả được chia tỷ lệ.
  4. Gọi canvas.toBlob để mã hóa lại ở định dạng nguồn. PNG giữ nguyên không mất dữ liệu, JPEG và WebP được mã hóa lại ở chất lượng cao. Sau đó trang hiển thị thẻ trước/sau và cung cấp tải xuống từng ảnh hoặc một ZIP duy nhất được tạo trong bộ nhớ với fflate.

Tại sao cần thay đổi kích thước ảnh?

  • Ảnh quá lớn là nguyên nhân phổ biến nhất gây trang chậm. Ảnh điện thoại 4000×3000 đặt thẳng vào bố cục rộng 600 pixel gửi khoảng 40 lần nhiều pixel hơn màn hình có thể hiển thị. Giới hạn cạnh dài nhất ở 1600 px trước khi tải lên giảm đáng kể trọng lượng trang và cải thiện LCP Core Web Vitals.
  • Biểu mẫu tải lên áp đặt kích thước nghiêm ngặt. Ô avatar, cổng ảnh ID, danh sách marketplace và thẻ OG xã hội đều cần kích thước pixel cụ thể: 1200×630 cho xem trước Open Graph, 512×512 cho biểu tượng ứng dụng, 150×150 cho hình thu nhỏ. Nhập đúng số và bỏ qua vòng lặp tải lên bị từ chối.
  • Các công cụ email và chat âm thầm nén lại mọi thứ lớn, điều này có thể làm hỏng ảnh chụp màn hình sạch. Tự thay đổi kích thước về chiều rộng hợp lý giúp kết quả dự đoán được thay vì giao cho quy trình lossy của người khác.
  • Sự nhất quán hàng loạt quan trọng với thư viện và danh mục. Chạy thư mục ảnh nhiều kích thước qua một mục tiêu 800×800 có nghĩa là mỗi thẻ căn thẳng hàng trên lưới, không có ảnh lớn nào phá vỡ bố cục.

Ứng dụng phổ biến

Thay đổi kích thước xuất hiện khi kích thước nguồn và kỳ vọng của đích không khớp. Ba mẫu xuất hiện lặp đi lặp lại.

  • Chuẩn bị ảnh sản phẩm cho cửa hàng Shopify hoặc WooCommerce. Thư mục ảnh gốc từ máy ảnh 4000 pixel được giới hạn ở cạnh dài nhất 1600 px để cửa hàng tải nhanh, trong khi tỷ lệ khung hình giữ nguyên không bị kéo dài.
  • Tạo tài nguyên mạng xã hội và ứng dụng từ một tệp chính. Đặt chính xác 1200×630 cho thẻ Open Graph, rồi 512×512 cho biểu tượng ứng dụng, xuất mỗi cái chỉ vài cú nhấp mà không cần mở trình chỉnh sửa nặng.
  • Thu nhỏ hàng loạt ảnh chụp màn hình QA hoặc hỗ trợ trước khi đính vào phiếu. Chia tỷ lệ thư mục 50 ảnh về 50% thường cắt kích thước kho lưu trữ khoảng ba phần tư trước khi vào bug tracker.

Ví dụ thực tế: ảnh 4000 px thành ảnh web 1600 px

Ảnh 4000×3000 từ điện thoại là tải trọng phổ biến lớn hơn nhiều so với bất kỳ bố cục web nào cần. Đây là chuẩn mực công bằng cho những gì thay đổi kích thước tiết kiệm.

Kéo ảnh vào vùng tải lên, để chế độ ở Giới hạn cạnh dài nhất, và đặt giá trị thành 1600. Quy trình Canvas vẽ lại ảnh ở 1600×1200 với tỷ lệ khung hình được giữ nguyên, rồi mã hóa lại ở định dạng gốc. Thẻ đầu ra hiển thị kích thước mới và dung lượng tệp, với JPEG điển hình giảm từ vài megabyte xuống còn vài trăm kilobyte. Nhấp Tải xuống trên thẻ để lấy tệp đơn, hoặc nhấp Tải .zip nếu bạn thay đổi kích thước nhiều ảnh trong một lần. Toàn bộ quá trình, từ kéo đến tải xuống, chạy trong một phần nhỏ của giây và không sử dụng băng thông nào sau khi trang tải xong.

Những chế độ thay đổi kích thước nào có sẵn?

Ba chế độ. Giới hạn cạnh dài nhất giới hạn chiều rộng hoặc chiều cao dài hơn theo giá trị pixel và chia tỷ lệ cạnh kia để khớp — đây là mặc định an toàn vì không bao giờ bóp méo. Chiều rộng × chiều cao chính xác cho phép nhập cả hai số, với khóa tỷ lệ khung hình tự động tính trường thứ hai từ tỷ lệ nguồn khi bạn chỉnh sửa trường đầu — tắt khóa khi biểu mẫu yêu cầu kích thước không tỷ lệ chính xác. Chia tỷ lệ theo phần trăm nhân cả hai kích thước với một hệ số, tiện cho việc giảm một nửa hoặc nhân đôi toàn bộ lô cùng lúc. Sáu cấu hình sẵn một cú nhấp (từ 1920×1080 đến hình thu nhỏ 150×150) bao gồm các mục tiêu phổ biến nhất.

Điều này có xảy ra trên thiết bị của tôi không?

Có. Trang sử dụng Canvas API gốc của trình duyệt và Web File API để giải mã, vẽ lại và mã hóa lại từng ảnh trong bộ nhớ. Không có dữ liệu ảnh nào được gửi đến máy chủ, không có tải lên tạm thời, không có vòng đi đám mây. Bạn có thể tự kiểm tra: mở DevTools, chuyển sang bảng Mạng, và chạy thay đổi kích thước. Các yêu cầu gửi đi duy nhất bạn thấy là tải trang ban đầu và các lệnh gọi quảng cáo. Không có gì có hình dạng ảnh rời khỏi tab, điều này khiến nó an toàn cho tài liệu ID được quét, ảnh y tế và các tài liệu khác mà bạn không bao giờ muốn tải lên.

Thay đổi kích thước có làm giảm chất lượng không?

Thu nhỏ ảnh (giảm tỷ lệ) trông rất tốt — trình duyệt lấy trung bình các pixel nguồn thành ít pixel hơn, nên chi tiết vẫn sắc nét và tệp nhỏ hơn nhiều. Phóng to vượt quá độ phân giải nguồn (tăng tỷ lệ) không thể tạo ra chi tiết chưa bao giờ được chụp, nên ảnh nhỏ được phóng to sẽ trông mờ — đây là giới hạn của mọi công cụ thay đổi kích thước, không riêng cái này. Đầu ra giữ nguyên định dạng nguồn: PNG vẫn không mất dữ liệu, JPEG và WebP được mã hóa lại ở cài đặt chất lượng cao nên sự khác biệt trực quan với bản gốc khó nhận ra.

Những định dạng tệp nào được hỗ trợ?

Về phần đầu vào, bất kỳ định dạng nào trình duyệt có thể giải mã đều được chấp nhận: PNG, JPEG, WebP, GIF và BMP bao phủ hầu hết mọi tệp do điện thoại, máy ảnh hoặc công cụ chụp màn hình tạo ra. Đầu ra giữ nguyên định dạng nguồn nơi trình mã hóa Canvas hỗ trợ — PNG, JPEG và WebP hoạt động trực tiếp. GIF và BMP, mà Canvas API có thể giải mã nhưng không mã hóa lại, được lưu dưới dạng PNG không mất dữ liệu. Tên tệp sau khi thay đổi kích thước bao gồm kích thước mới (ví dụ photo-1600x1200.jpg) để dễ sắp xếp lô.

Kéo ảnh của bạn vào, chọn kích thước, thay đổi. Mọi thứ chạy trong tab của bạn. Không tải lên, không cần tài khoản, không chờ hàng đợi máy chủ.