Công cụ Thay Đổi Kích Thước Hình Ảnh Trực Tuyến Miễn Phí

Thay đổi kích thước hình ảnh thành kích thước pixel chính xác. Duy trì tỷ lệ khung hình hoặc đặt chiều rộng và chiều cao tùy chỉnh. Không tải lên máy chủ nào.

100% phía máy khách · tệp của bạn không bao giờ rời khỏi thiết bị

Thả hình ảnh vào đây hoặc nhấp để duyệt

Hỗ trợ JPEG, PNG và WebP · lên tới 20 MB

Cách đổi kích thước hình ảnh

Chọn hoặc thả một tệp hình ảnh ở trên.
Chọn kích thước thiết lập sẵn hoặc nhập chiều rộng và chiều cao tùy chỉnh theo pixel.
Bật/tắt biểu tượng khóa để giữ nguyên hoặc bỏ qua tỷ lệ khung hình gốc.
Nhấp "Đổi kích thước hình ảnh" để xử lý hình trong trình duyệt của bạn.
Tải xuống hình ảnh đã đổi kích thước ngay lập tức.

Việc đổi kích thước thực sự làm gì với các pixel của bạn

Đổi kích thước hình ảnh không giống với thao tác cắt hoặc nén nó. Cắt loại bỏ các pixel ở các cạnh và giữ phần còn lại không thay đổi. Nén giữ mọi pixel nhưng mã hóa chúng chặt chẽ hơn. Đổi kích thước thực sự thay đổi số lượng pixel: một hình ảnh nguồn 4000x3000 được điều chỉnh lại tỷ lệ thành 1920x1440 phải vứt bỏ hầu hết các pixel của nó và chọn các pixel mới để đại diện cho cùng cảnh ở một phần tư độ phân giải. Thao tác toán học quyết định pixel mới nào cần viết được gọi là resampling, và chất lượng của việc thay đổi tỷ lệ gần như hoàn toàn phụ thuộc vào thuật toán resampling nào chạy.

Bốn thuật toán resampling được sử dụng phổ biến là nearest-neighbour (chọn pixel nguồn gần nhất duy nhất, các cạnh cứng được bảo tồn, có khối khi phóng to, lựa chọn đúng duy nhất cho pixel art), bilinear (pha trộn tuyến tính của 4 pixel nguồn xung quanh, nhanh và tầm thường), bicubic (nhân kubik Keys 1981 trên 16 pixel xung quanh, mặc định Photoshop trong nhiều thập kỷ), và Lanczos (hàm sinc được cửa sổ hóa bởi nhân Lanczos, đầu ra sắc nét nhất, ringing nhẹ gần các cạnh cứng, những gì ImageMagick và Sharp sử dụng theo mặc định cho downscale). Công cụ này đặt imageSmoothingQuality của Canvas API thành "high", mà Chrome và Firefox diễn giải là nhân lớp Lanczos trên máy tính để bàn và Safari diễn giải là nhân lớp bicubic. Trình duyệt chọn; JavaScript có thể yêu cầu high nhưng không thể chọn bộ lọc chính xác.

Downscaling và upscaling không phải là các vấn đề đối xứng. Downscaling loại bỏ thông tin một cách có kiểm soát; resampler quyết định chi tiết nào cần giữ và một thuật toán tốt bảo tồn cấu trúc nhìn thấy được của nguồn. Upscaling thêm các pixel chưa bao giờ được lấy mẫu, và lý thuyết thông tin (định lý lấy mẫu Nyquist-Shannon) nói rằng bạn không thể phục hồi các tần số không có trong tín hiệu gốc. Điều tốt nhất mà một resampler cổ điển có thể làm là nội suy mượt mà giữa các mẫu đã biết, luôn trông mềm. Để phóng to chân thực, lựa chọn thay thế hiện đại là super-resolution AI (Real-ESRGAN, waifu2x, Adobe Super Resolution, Topaz Gigapixel), nó tạo ra chi tiết hợp lý sử dụng mạng nơ-ron được đào tạo trên hàng triệu hình ảnh tương tự. Đó không phải là những gì đang xảy ra ở đây. Công cụ này thực hiện nội suy trung thực.

Công cụ này hoạt động bên dưới như thế nào

Toàn bộ pipeline là HTML5 Canvas 2D API. Không có thư viện bên ngoài nào được tải. Khi bạn thả một hình ảnh, File API của trình duyệt chuyển các byte cho một HTMLImageElement mới; bộ giải mã JPEG, PNG, hoặc WebP tích hợp của trình duyệt biến bitstream thành bộ đệm pixel. Tỷ lệ khung hình được tính từ chiều rộng và chiều cao tự nhiên. Một phần tử <canvas> mới được tạo trong bộ nhớ ở các kích thước đích bạn đặt, và ctx.drawImage(image, 0, 0, targetWidth, targetHeight) vẽ nguồn được điều chỉnh tỷ lệ vào đích. Bởi vì đích có các kích thước khác với nguồn, trình duyệt gọi nhân resampling của nó để tính mọi pixel mới.

Trước cuộc gọi drawImage, công cụ đặt ctx.imageSmoothingEnabled = true và ctx.imageSmoothingQuality = "high". Cờ đầu tiên bật làm mịn (nearest-neighbour tắt); cờ thứ hai gợi ý cho trình duyệt sử dụng bộ lọc chất lượng cao nhất của nó. Đặc tả canvas WHATWG để lại bộ lọc chính xác cho việc triển khai. Chrome và Firefox trên máy tính để bàn sử dụng các nhân lớp Lanczos tại high; Safari sử dụng nhân lớp bicubic; các bản dựng di động có thể hạ cấp xuống bilinear dưới áp lực bộ nhớ. Không ai trong số này có thể nhìn thấy với JavaScript. Sau khi vẽ, canvas.toBlob(mimeType, quality) tuần tự hóa canvas thành Blob ở định dạng đầu ra bạn đã chọn: PNG (DEFLATE không tổn thất, đối số quality bị bỏ qua), JPEG (DCT có tổn thất ở chất lượng 0,92), hoặc WebP (có tổn thất hoặc không tổn thất ở chất lượng 0,92). Blob trở thành một URL đối tượng có thể tải xuống.

Không có byte nào rời tab. Hình ảnh được giải mã trong trình duyệt của bạn, được lấy mẫu lại trong trình duyệt của bạn, và được mã hóa lại trong trình duyệt của bạn. Tệp đã tải xuống được tạo cục bộ và được lưu vào thiết bị của bạn bằng cơ chế tải xuống thông thường của trình duyệt. Lưu lượng mạng duy nhất là tải trang ban đầu và tập lệnh image-resizer.js nhỏ (vài kilobyte). Chuyển trình duyệt của bạn sang chế độ máy bay sau khi trang đã tải và bộ thay đổi kích thước tiếp tục hoạt động trên bất kỳ hình ảnh cục bộ nào bạn chọn. Mở tab Network của DevTools trong khi đổi kích thước: không có yêu cầu nào mang dữ liệu hình ảnh. Toàn bộ kiến trúc cố ý tối thiểu vì Canvas API đã đủ mạnh cho công việc này; kéo vào một thư viện chỉ thêm byte và độ phức tạp mà không thay đổi đầu ra.

Lịch sử ngắn về resampling hình ảnh

Máy phóng quang học, thời đại tiền kỹ thuật số. Trước nhiếp ảnh kỹ thuật số, việc phóng to một bức ảnh có nghĩa là chiếu một negative qua máy phóng quang học lên một tờ giấy nhạy sáng. Ống kính thực hiện resampling liên tục, không có lượng tử hóa, nhưng với các giới hạn quang học của chính ống kính. Các máy phóng thương mại đầu tiên có từ những năm 1860. Resampling như một phép toán chỉ trở thành một câu hỏi có ý nghĩa khi hình ảnh tồn tại dưới dạng lưới pixel chứ không phải nhũ tương liên tục.
Nội suy bicubic, 1973-1981. Robert G. Rifman đã xuất bản một thuật toán resampling hình ảnh bicubic-spline tại TRW Defense and Space Systems vào năm 1973, được viết cho việc thay đổi tỷ lệ hình ảnh vệ tinh. Công thức tiêu chuẩn đến từ R. G. Keys vào năm 1981: Cubic Convolution Interpolation for Digital Image Processing trong IEEE Transactions on Acoustics, Speech, and Signal Processing. Mọi thư viện hình ảnh nói bicubic ngày nay có nghĩa là nhân kubik Keys được đánh giá trên một khu vực 4x4.
Bộ lọc Mitchell-Netravali, 1988. Don P. Mitchell và Arun N. Netravali đã xuất bản Reconstruction Filters in Computer Graphics tại SIGGRAPH '88, giới thiệu một gia đình tham số hóa các bộ lọc kubik có thể điều chỉnh bằng hai hệ số B và C. Bộ lọc Mitchell tiêu chuẩn (B=C=1/3) đổi một lượng nhỏ độ sắc nét lấy ringing rất thấp và trở thành mặc định tiêu chuẩn cho downscale trong các thư viện hình ảnh cấp cao như libvips.
Bộ lọc có thể chọn ImageMagick, những năm 1990. John Cristy đã phát hành ImageMagick (ban đầu vào năm 1987, công khai vào năm 1990) với các bộ lọc resampling có thể chọn như một tính năng hạng nhất. Vào giữa những năm 1990, các nhiếp ảnh gia và chuyên gia DTP có thể so sánh Lanczos, Mitchell, Catmull-Rom, Hermite và Gaussian trên cùng hình ảnh nguồn, chọn theo trường hợp sử dụng. -filter Lanczos của ImageMagick vẫn là một công thức phổ biến trong các pipeline sản xuất.
HTML5 Canvas resize, 2008-2017. Đặc tả canvas WHATWG đã chuẩn hóa drawImage() với việc tỷ lệ ngầm vào năm 2008, và dạng 9 đối số (được sử dụng ở đây) đã có trong mọi trình duyệt kể từ đó. Thuộc tính imageSmoothingQuality (low / medium / high) được phát hành sau, Chrome 54 vào năm 2016, Firefox 51 vào năm 2017, Safari 11.1 vào năm 2018. Trước đó, việc đổi kích thước phía trình duyệt thực sự chỉ là bilinear trên mọi triển khai, ngay cả khi công cụ yêu cầu high quality.
Super-resolution AI, 2018-2021. ESRGAN (Wang et al., 2018) đã chứng minh rằng các mạng đối kháng tạo sinh có thể tổng hợp chi tiết tin cậy cho các bức ảnh được upscale. Real-ESRGAN (Wang et al., 2021) đã làm cho kỹ thuật trở nên thực tế cho các đầu vào thế giới thực; waifu2x (nagadomi, 2015) đã sớm điều chỉnh một biến thể dựa trên CNN cho nghệ thuật anime. Adobe Camera Raw đã thêm Super Resolution vào năm 2021. Các công cụ này không thay thế resampling cổ điển cho downscale; chúng nhắm đến trường hợp khi bạn đặc biệt muốn chi tiết được tạo ra ảo giác thay vì nội suy mượt mà.

Kích thước hình ảnh thông dụng

1920 x 1080 · Full HD, tiêu chuẩn cho hình nền web và hình thu nhỏ YouTube.
1080 x 1080 · Bài đăng feed Instagram (vuông).
1080 x 1350 · Bài đăng dọc Instagram (chiếm nhiều không gian màn hình hơn trong feed).
1280 x 720 · HD, phù hợp cho tiêu đề blog và bài thuyết trình.
800 x 600 · Kích thước hình web cổ điển, phù hợp cho bản tin email.
400 x 400 · Ảnh đại diện và avatar.
16 x 16 / 32 x 32 · Kích thước Favicon cho trang web.

Quy trình đổi kích thước trong thế giới thực

Định cỡ nền tảng truyền thông xã hội. Mọi nền tảng xã hội đều có các kích thước ưu tiên cho các bài đăng feed, story, banner và thumbnail. Tải lên ở kích thước sai có nghĩa là nền tảng cắt hoặc letterbox thay mặt bạn, thường là tệ. Mục tiêu 2026 phổ biến: Instagram feed 1080x1080 (vuông) hoặc 1080x1350 (chân dung, hiện là định dạng tĩnh có engagement cao nhất vì nó chiếm khoảng 25% màn hình dọc hơn trên các feed di động), Instagram Stories và Reels 1080x1920, thumbnail YouTube 1280x720, thẻ in-stream Twitter/X 1200x675, xem trước liên kết Facebook và LinkedIn (Open Graph) 1200x630, ghim chuẩn Pinterest 1000x1500, TikTok 1080x1920. Đổi kích thước một lần trước khi tải lên đảm bảo kết quả bạn muốn; tải lên ảnh thô để lại lựa chọn cho nền tảng.
Tối ưu hóa web và Core Web Vitals. Cuộc kiểm tra Properly size images của Lighthouse thất bại trên bất kỳ hình ảnh nào trong đó kích thước tự nhiên lớn hơn nhiều so với kích thước hiển thị. Một hình ảnh hero được hiển thị ở 1200 pixel rộng nhưng được phục vụ ở 4000 pixel lãng phí băng thông và làm hỏng Largest Contentful Paint, Core Web Vital dễ thấy nhất. Cách khắc phục là đổi kích thước nguồn thành khoảng kích thước hiển thị, hoặc 2x cho hiển thị retina, và phục vụ các kích thước khác nhau cho các viewport khác nhau thông qua thuộc tính srcset hiện đại. Đổi kích thước một hình ảnh hero duy nhất từ 4000 xuống 1920 pixel thường cắt kích thước tệp 60 đến 80% và điểm LCP theo sau trực tiếp.
Tệp đính kèm email. Gmail, Outlook và Apple Mail đều giới hạn các tệp đính kèm ở mức 25 MB mỗi tin nhắn. Một thư mục ảnh điện thoại ở độ phân giải đầy đủ có thể đạt đến giới hạn với chỉ năm hoặc sáu hình ảnh. Đổi kích thước cạnh dài thành 1920 pixel thường cắt mỗi ảnh xuống dưới 1 MB trong khi vẫn có thể xem được hoàn hảo trên bất kỳ màn hình laptop hoặc điện thoại nào. Hai mươi ảnh ở 1920 pixel vừa vặn thoải mái trong một tin nhắn duy nhất; cùng hai mươi ảnh ở độ phân giải đầy đủ sẽ cần ba hoặc bốn lần gửi hoặc một liên kết chia sẻ cloud.
Ảnh hồ sơ và avatar. Hầu hết các nền tảng xã hội muốn 400x400 đến 800x800 pixel cho ảnh hồ sơ và hiển thị chúng dưới dạng hình tròn. Đổi kích thước cục bộ trước khi tải lên cho phép bạn kiểm soát cắt tỷ lệ khung hình vuông (kết hợp với Image Cropper của công cụ này) và số lượng pixel chính xác, thay vì để nền tảng cắt tùy ý. Quy tắc ngón tay cái cho hiển thị retina là tải lên ở hai lần kích thước hiển thị, vì vậy avatar 200 pixel phải ít nhất là nguồn 400x400.
Tạo favicon và biểu tượng ứng dụng. Các trình duyệt hiện đại muốn 16x16 (tab trình duyệt) và 32x32 (tab DPI cao), các biểu tượng cảm ứng Apple muốn 180x180, các biểu tượng tile Windows muốn 270x270, và các bản kê khai Progressive Web App thường bao gồm 192x192 cộng 512x512. Đổi kích thước một nguồn vuông được thiết kế tốt (thường là PNG 512x512 không có chi tiết tinh) cho mỗi mục tiêu này là quy trình chuẩn để tạo các biểu tượng sắc nét trên mọi nền tảng.
Chuẩn bị in. Một bản in ảnh 4x6 inch ở 300 DPI cần 1200x1800 pixel độ phân giải nguồn. Một poster 16x20 inch cần 4800x6000. Một bản in 8x10 inch ở 240 DPI (chất lượng giấy báo) cần 1920x2400. Đổi kích thước nguồn thành số pixel chính xác cho kích thước in dự định có nghĩa là phòng in không cần tự động lấy mẫu lại thay mặt bạn, tránh các lựa chọn bộ lọc không thể đoán trước và cài đặt chất lượng không xác định. Ghép số pixel đã đổi kích thước với metadata DPI phù hợp trong hộp thoại in của bạn và kết quả phù hợp với những gì bạn thấy trên màn hình.

Cạm bẫy phổ biến và ý nghĩa của chúng

Upscaling luôn trông mờ. Một hình thu nhỏ rộng 200 pixel được phóng to thành 1920 pixel sẽ trông mềm bất kể trình duyệt hay cài đặt chất lượng nào được sử dụng. Nội suy cổ điển (bicubic, Lanczos, Mitchell) chỉ có thể làm mịn giữa các mẫu đã biết; nó không thể phát minh ra các chi tiết bị thiếu. Trần lý thuyết thông tin được thiết lập bởi tần số Nyquist của nguồn. Để phóng to thực sự tạo ra đầu ra sắc nét, hãy chạy nguồn qua một công cụ super-resolution (Real-ESRGAN, Topaz Gigapixel AI, Adobe Super Resolution trong Camera Raw) tạo ra chi tiết hợp lý sử dụng mạng nơ-ron được đào tạo trên hàng triệu hình ảnh tương tự.
Mở khóa tỷ lệ khung hình kéo dài bức ảnh. Với biểu tượng khóa bị vô hiệu hóa và chiều rộng và chiều cao không khớp, đầu ra bị nén hoặc kéo dài về mặt toán học. Công cụ mặc định khóa-bật; mở khóa là một hành động có chủ ý. Nếu bạn cần phù hợp với tỷ lệ khung hình mục tiêu chứ không phải tỷ lệ tự nhiên của nguồn, quy trình đúng là cắt trước (sử dụng Image Cropper) rồi đổi kích thước kết quả đã cắt. Điều đó giữ tỷ lệ chính xác và đối tượng không bị méo.
Pixel art bị làm mịn đi. Mặc định smoothing-on của công cụ này phá hủy các sprite 8-bit, các biểu tượng lưới pixel và bất kỳ đồ họa nào mà các cạnh cứng giữa các ô màu là điểm quan trọng. Resampling với bất kỳ bộ lọc làm mịn nào (bilinear, bicubic, Lanczos) làm mờ các cạnh đó thành gradient. Đối với pixel art, câu trả lời đúng là resize nearest-neighbour, giữ nguyên mọi cạnh cứng. Phía trình duyệt, đặt image-rendering: pixelated trong CSS trên hình ảnh được hiển thị. Để xuất thực tế ở kích thước mới, hãy sử dụng một công cụ máy tính: -filter Point của ImageMagick, nội suy None của GIMP, hoặc các trình chỉnh sửa chuyên dụng như Aseprite.
Đổi kích thước lại làm thoái hóa JPEG và WebP. Mỗi vòng qua canvas mã hóa lại JPEG hoặc WebP ở chất lượng 0,92. Pass đầu tiên về mặt thị giác không thể nhận thấy; pass thứ ba hoặc thứ tư giới thiệu các artifact có thể nhìn thấy trong các vùng phẳng và làm mềm các chi tiết tinh. Luôn đổi kích thước từ master độ phân giải cao nhất bạn có, không phải từ một bản sao bạn đã xuất hôm qua. Nếu bạn cần lặp lại (thử 1920, sau đó 1600, sau đó 1280), hãy quay lại nguồn gốc mỗi lần thay vì xâu chuỗi các resize.
DPI in không giống với kích thước pixel. Nhiều người mong đợi một trường DPI hoặc resolution để kiểm soát kích thước in. Công cụ này chỉ đổi kích thước theo số pixel. Thẻ metadata DPI trong JPEG hoặc PNG là thông tin tư vấn cho các máy in cho biết bao nhiêu pixel-per-inch để render trên giấy. Kích thước pixel và DPI là độc lập: một hình ảnh 1920x1080 là 1920x1080 pixel ở bất kỳ cài đặt DPI nào. Để kiểm soát kích thước in, bạn cũng cần đặt DPI đúng trong hộp thoại in hoặc trong công cụ ảnh máy tính (bảng Print của Preview, hộp thoại Image Size của Photoshop với Resample Image tắt).
Hình ảnh rất lớn có thể làm sập một tab trình duyệt di động. Giải mã một hình ảnh sang canvas cần RAM tỷ lệ thuận với kích thước của nó: một bức ảnh 24 megapixel (6000x4000 pixel) cần khoảng 96 MB chỉ cho bộ đệm pixel RGBA nguồn, cộng với một bộ đệm riêng cho canvas đích, cộng với không gian làm việc của bộ mã hóa JPEG hoặc WebP. Các thiết bị di động với 1 đến 2 GB RAM có sẵn cho trình duyệt có thể bị OS chấm dứt tab trước khi mã hóa hoàn tất. Đối với những bức ảnh rất lớn, đổi kích thước trên trình duyệt máy tính, hoặc giảm kích thước theo từng giai đoạn (50% đầu tiên, sau đó 50% nữa) để mỗi bước vừa với bộ nhớ có sẵn.

Quyền riêng tư: hình ảnh không bao giờ rời thiết bị của bạn

Mọi bộ thay đổi kích thước hình ảnh dựa trên đám mây (iLoveIMG, ResizeImage.net, ResizePixel, BeFunky, Fotor, endpoint resize của Pixlr, hàng tá dịch vụ resize image online) tải lên tệp của bạn lên máy chủ của nhà điều hành, chạy thuật toán resize của họ, và trả về hình ảnh nhỏ hơn dưới dạng tải xuống. Tác động về quyền riêng tư không tầm thường vì ảnh thường xuyên chứa nội dung có thể nhận dạng: khuôn mặt, địa chỉ có thể nhìn thấy trong nền, ảnh chụp màn hình của UI nội bộ hoặc tài liệu bí mật, ảnh trẻ em, ảnh được chụp trong không gian riêng tư, các bản quét tài liệu chứa thông tin cá nhân. Hầu hết các nhà điều hành xuất bản các chính sách quyền riêng tư cam kết xóa các tải lên trong vòng một hoặc hai giờ và mã hóa khi truyền, và các nhà lớn hơn giữ chứng nhận ISO/IEC 27001. Họ có lý do thương mại mạnh mẽ để tôn trọng các chính sách đó. Nhưng đã xóa trong vòng một giờ không phải là không bao giờ thấy. Trong giờ đó, nội dung hình ảnh nằm trong cơ sở hạ tầng của nhà điều hành, có thể truy cập bởi bất kỳ quy trình hoặc người nào có quyền thích hợp, và hiển thị trong nhật ký và sao lưu theo bất kỳ chính sách lưu giữ nào áp dụng.

Bộ thay đổi kích thước này không bao giờ tải lên bất cứ điều gì. Toàn bộ pipeline (chọn tệp, giải mã hình ảnh, đổi kích thước canvas, mã hóa, tải xuống) chạy bên trong tab trình duyệt của bạn bằng JavaScript và HTML5 Canvas API. Không tải lên, không có yêu cầu mạng nào mang dữ liệu hình ảnh, không có mục nhật ký. Bạn có thể xác minh bằng cách mở các công cụ dành cho nhà phát triển trình duyệt vào tab Network trước khi đổi kích thước: không có yêu cầu nào kích hoạt với nội dung hình ảnh. Lưu lượng mạng duy nhất là việc tải trang ban đầu và một tập lệnh image-resizer.js nhỏ. Chuyển trình duyệt sang chế độ máy bay sau khi trang đã tải và bộ thay đổi kích thước tiếp tục hoạt động trên bất kỳ tệp cục bộ nào bạn chọn, bằng chứng thực nghiệm mạnh nhất rằng không có gì đang được tải lên. Đối với ảnh có bất cứ điều gì nhạy cảm (khuôn mặt, vị trí, ảnh chụp màn hình nội bộ, tài liệu ID), việc giao dịch phía trình duyệt rõ ràng đáng để thực hiện.

Khi một công cụ khác là lựa chọn đúng

Tự động hóa hàng loạt qua hàng trăm tệp. Sử dụng sharp trong Node.js (thư viện hình ảnh phía máy chủ chuẩn, được xây dựng trên libvips), ImageMagick hoặc GraphicsMagick trên dòng lệnh, hoặc Pillow trong Python. Các công cụ này xử lý hàng nghìn tệp mà không có giới hạn bộ nhớ trình duyệt, hiển thị mọi nhân resampling như một tùy chọn rõ ràng, và chạy từ các công việc CI, hook triển khai, hoặc nhiệm vụ cron.
Super-resolution AI cho phóng to chân thực. Để phóng to sắc nét mà thực sự thêm chi tiết, hãy sử dụng một bộ upscaler mạng nơ-ron. Real-ESRGAN (mã nguồn mở, chạy cục bộ qua ChaiNNer hoặc CLI), waifu2x (mã nguồn mở, có sẵn các bản demo web miễn phí), Topaz Gigapixel AI (máy tính thương mại), hoặc Adobe Super Resolution bên trong Camera Raw hoặc Lightroom. Các mô hình này tạo ra chi tiết hợp lý chứ không phải phục hồi nó; kết quả trông sắc nét trên khuôn mặt và kết cấu tự nhiên vì mô hình đã thấy nhiều hình ảnh tương tự trong quá trình đào tạo.
Đổi kích thước pixel-art bảo tồn các cạnh cứng. Sử dụng một công cụ hiển thị resampling nearest-neighbour rõ ràng: -filter Point của ImageMagick, nội suy của GIMP đặt thành None, hoặc các trình chỉnh sửa pixel-art chuyên dụng như Aseprite. Công cụ này luôn làm mịn vì cờ imageSmoothingEnabled của Canvas API đang bật; tắt nó sẽ làm thoái hóa mọi trường hợp sử dụng khác, vì vậy sự đánh đổi thiên về ảnh hơn là sprite.
Quy trình cấp in với kiểm soát DPI. Adobe Photoshop, Affinity Photo, hoặc Lightroom hiển thị cả kích thước pixel và DPI như các cài đặt độc lập, hỗ trợ các quy trình quản lý màu (bảo tồn hồ sơ ICC, soft proofing, đầu ra CMYK), và ghi nhớ lịch sử resize không phá hủy. Đổi kích thước Canvas dựa trên trình duyệt không thể đảm bảo bất kỳ điều nào trong số đó vì Canvas hoạt động trong sRGB và có thể loại bỏ các hồ sơ màu được nhúng trong quá trình mã hóa lại.

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

Đổi kích thước có làm giảm chất lượng hình ảnh không?

Thu nhỏ giữ nguyên chất lượng tốt. Phóng to (làm hình lớn hơn bản gốc) sẽ gây mờ đôi chút vì các pixel mới phải được nội suy. Để có kết quả tốt nhất, hãy bắt đầu với hình nguồn độ phân giải cao nhất bạn có.

"Khóa tỷ lệ khung hình" làm gì?

Khi khóa, thay đổi chiều rộng sẽ tự động điều chỉnh chiều cao (và ngược lại) để giữ tỷ lệ gốc của hình. Mở khóa nếu bạn cần kéo giãn hoặc nén hình theo kích thước chính xác.

Hình của tôi có được tải lên máy chủ không?

Không. Tất cả việc đổi kích thước đều diễn ra cục bộ trong trình duyệt của bạn bằng HTML5 Canvas API. Hình của bạn không bao giờ rời khỏi thiết bị.

Tôi có thể thay đổi định dạng đầu ra không?

Có. Bạn có thể xuất hình đã đổi kích thước ở định dạng JPEG, PNG hoặc WebP bất kể định dạng gốc là gì. Điều này hữu ích để chuyển đổi định dạng trong khi đổi kích thước.

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

Sự khác biệt giữa DPI, PPI và kích thước pixel là gì?

Kích thước pixel (chiều rộng nhân chiều cao tính bằng pixel) mô tả những gì hình ảnh thực sự chứa. PPI (pixel mỗi inch) mô tả mức độ dày đặc của những pixel đó khi được hiển thị trên màn hình, một thuộc tính của phần cứng hiển thị, không phải tệp. DPI (chấm mỗi inch) mô tả bao nhiêu chấm đầu ra máy in sẽ được đặt mỗi inch giấy khi hình ảnh được in. Thẻ DPI được nhúng trong một JPEG hoặc PNG là metadata tư vấn cho máy in; nó không thay đổi dữ liệu pixel. Một hình ảnh 1920x1080 là 1920x1080 pixel ở bất kỳ cài đặt DPI nào. Để thu nhỏ bản in, hoặc giảm số lượng pixel (công cụ này) hoặc tăng metadata DPI trước khi gửi đi in (hộp thoại Print của công cụ máy tính hoặc Image Size của Photoshop với Resample Image tắt).

Tại sao hình ảnh đã được phóng to của tôi trông mờ?

Bởi vì lý thuyết thông tin nói nó phải như vậy. Resampling cổ điển (bicubic, Lanczos, Mitchell) chỉ có thể nội suy mượt mà giữa các pixel nguồn đã biết; nó không thể phát minh ra chi tiết chưa bao giờ được lấy mẫu. Định lý lấy mẫu Nyquist-Shannon đặt ra một trần cứng: các tần số trên một nửa tốc độ lưới pixel của nguồn về mặt toán học không thể phục hồi được. Phóng to nguồn 200 pixel thành 1920 pixel sẽ luôn trông mềm vì 90% các pixel mới được nội suy. Để phóng to sắc nét, hãy sử dụng một mô hình super-resolution (Real-ESRGAN, Topaz Gigapixel, Adobe Super Resolution) tổng hợp chi tiết hợp lý thông qua một mạng nơ-ron được đào tạo trên hàng triệu hình ảnh tương tự.

Tôi có nên đổi kích thước cho màn hình retina hoặc HiDPI không?

Có. Các màn hình iPhone retina, MacBook và HiDPI Windows render ở mật độ pixel CSS logic 2x hoặc 3x. Một hình ảnh hero hiển thị ở 1200 pixel logic rộng trên màn hình retina thực sự vẽ 2400 pixel vật lý. Phục vụ nguồn 2x thông qua thuộc tính srcset của HTML (tiêu chuẩn hình ảnh đáp ứng hiện đại) và trình duyệt chọn cái phù hợp cho thiết bị của mỗi người xem. Đối với một avatar duy nhất hoặc hình ảnh hero không có srcset, chỉ cần đổi kích thước thành 2x kích thước hiển thị: hình ảnh sẽ sắc nét trên retina và chỉ hơi quá lớn trên non-retina, điều này tốn một lượng nhỏ băng thông nhưng tránh được sự mờ dễ thấy hơn nhiều của một hình ảnh under-sized được kéo dài trên các pixel mật độ cao.

Công cụ này có hoạt động ngoại tuyến không?

Có. HTML5 Canvas API là một phần của chính trình duyệt, không phải một thư viện được tải xuống, vì vậy không có runtime riêng để cache. Trang tải theo cách thông thường; sau khi nó mở, bộ thay đổi kích thước chạy hoàn toàn từ mã tích hợp trình duyệt trên bất kỳ tệp cục bộ nào bạn chọn. Bạn có thể xác minh bằng cách chuyển sang chế độ máy bay sau khi mở trang và đổi kích thước một hình ảnh cục bộ. Kết quả đã tải xuống được tạo cục bộ và lưu bằng cơ chế tải xuống thông thường của trình duyệt, cũng không có sự liên quan đến mạng.

Tôi nên cắt trước khi đổi kích thước, hay sau?

Cắt trước, sau đó đổi kích thước. Cắt đặt tỷ lệ khung hình (16:9 cho YouTube, 1:1 cho feed Instagram, 9:16 cho Stories, 1.91:1 cho Open Graph) bằng cách loại bỏ các pixel cạnh không mong muốn. Đổi kích thước sau đó đặt số lượng pixel cho tỷ lệ khung hình đã chọn. Thực hiện các bước theo thứ tự khác cũng có thể nhưng lãng phí công việc, bạn sẽ lấy mẫu lại nhiều pixel hơn cần thiết và sau đó vứt bỏ một số trong khi cắt. Đối với công cụ này, sử dụng Image Cropper trước để đặt tỷ lệ khung hình, sau đó Image Resizer này để đặt kích thước đích chính xác. Nhiều quy trình cụ thể nền tảng (thumbnail YouTube ở 1280x720, feed Instagram ở 1080x1080) kết hợp cả hai bước; thực hiện chúng theo trình tự với hai công cụ chuyên dụng cho đầu ra sạch hơn so với cố gắng thực hiện cả hai cùng một lúc với các tỷ lệ khung hình kéo dài.

Có một desktop hoặc dòng lệnh tương đương không?

Vài cái. Đối với tự động hóa hàng loạt, sharp trong Node.js là thư viện phía máy chủ chuẩn (được xây dựng trên libvips). ImageMagick (magick input.jpg -resize 1920x1080 output.jpg) và GraphicsMagick chạy từ bất kỳ shell nào và xử lý các tệp khổng lồ. Pillow trong Python (Image.open(p).resize((1920, 1080), Image.LANCZOS)) là mặc định cho các quy trình khoa học dữ liệu. Đối với công việc tương tác đơn lẻ giống như công cụ này nhưng với kiểm soát per-kernel rõ ràng và nhiều định dạng đầu ra hơn bao gồm AVIF, Squoosh (Google Chrome Labs, hoàn toàn phía client) là phương án thay thế trình duyệt được khuyến nghị. Photoshop, Affinity Photo và Preview trên macOS (Tools, Adjust Size) bao quát trường hợp GUI desktop.