Về công cụ này
Công cụ này chuyển đổi một tệp SVG vector thành ảnh PNG hoặc JPEG ở độ phân giải bạn chọn, ngay trong trình duyệt. Thả một tệp .svg vào, công cụ sẽ đọc width, height và viewBox của chính tệp đó để gợi ý một kích thước khởi đầu hợp lý — sau đó bạn có thể nhập bất kỳ kích thước đầu ra nào mình muốn trước khi chuyển đổi.
Công cụ hữu ích bất cứ khi nào bạn cần phiên bản raster của hình vector: biến logo hoặc biểu tượng thành PNG cho một nền tảng không chấp nhận tải lên SVG, tạo nhiều kích thước pixel cố định (biểu tượng ứng dụng, favicon, ảnh đại diện mạng xã hội) từ một tệp vector gốc duy nhất, hoặc chèn một hình ảnh sắc nét vào tài liệu hay bản trình chiếu vốn chỉ nhận định dạng ảnh thông thường.
Vì SVG là hình vector chứ không phải lưới điểm ảnh, việc phóng to hay thu nhỏ về kích thước đầu ra bạn chọn vẫn giữ được độ sắc nét — không hề có hiện tượng mờ hay vỡ hạt như khi kéo giãn một ảnh JPEG hay PNG vượt quá độ phân giải gốc. Chọn PNG để giữ độ trong suốt của SVG gốc, hoặc JPEG kèm màu nền nếu bạn cần một ảnh phẳng hoàn toàn không trong suốt. Mọi thứ diễn ra cục bộ qua Canvas API — tệp SVG của bạn không bao giờ được tải lên bất cứ đâu.
Câu hỏi thường gặp
Tại sao PNG đã raster hóa của tôi trông bị vỡ pixel ở kích thước lớn?
Điều này không nên xảy ra nếu bản thân quá trình chuyển đổi hoạt động đúng — SVG là dữ liệu vector, vì vậy nó co giãn sạch sẽ theo BẤT KỲ kích thước pixel đầu ra nào mà không bị vỡ pixel, khác với việc phóng to một ảnh raster. Nếu PNG của bạn trông bị vỡ pixel, hãy kiểm tra lại xem chiều rộng/cao đầu ra bạn đặt có thực sự là điều bạn dự định không (một kích thước mục tiêu nhỏ hơn nhiều so với dự định sẽ trông "đúng" nhưng nhỏ, và sau đó sẽ trông mờ/vỡ pixel nếu bạn hiển thị nó ở kích thước lớn hơn nhiều trong trường hợp sử dụng cuối cùng — đó là vấn đề co giãn tại thời điểm hiển thị, không phải tại thời điểm chuyển đổi). Xuất lại với kích thước pixel cuối cùng thực sự dự định của bạn để có kết quả sắc nét.
Tại sao SVG của tôi hiển thị nhỏ hơn/lớn hơn dự kiến trước khi tôi đặt kích thước tùy chỉnh?
Kích thước mặc định hiển thị đến từ chính các thuộc tính `width`/`height` được khai báo của tệp SVG nếu có, hoặc kích thước `viewBox` của nó nếu không, hoặc mặc định chung 512×512 nếu tệp không có cả hai — nhiều SVG (đặc biệt là những SVG được xuất từ công cụ thiết kế) chỉ khai báo `viewBox` mà không có kích thước pixel rõ ràng, vì vậy kích thước "tự nhiên" bạn thấy không phải lúc nào cũng có ý nghĩa. Chỉ cần đặt các trường chiều rộng/chiều cao thành bất cứ thứ gì bạn thực sự cần; vì SVG là dữ liệu vector, không có sự đánh đổi chất lượng khi chọn kích thước khác với mặc định được phát hiện.