SVG → PNG
Chuyển SVG sang PNG
Thả một tệp vector và nhận PNG ở độ phân giải mà công việc yêu cầu. Việc raster hóa diễn ra trong thẻ này, nên công việc thiết kế chỉ ở giữa bạn và máy của bạn.
PNG có số pixel cố định: phóng to sau này sẽ làm ảnh mềm, trong khi SVG vẫn sắc nét ở mọi kích thước. Vùng trong suốt được giữ lại chứ không bị lấp.
Cách chuyển SVG sang PNG
Nạp tệp vector
Thả tệp .svg hoặc dán vào. Những tệp không khai báo chiều rộng và chiều cao trong phần đầu sẽ được kết xuất trong khung nhìn 1024 pixel.
Chọn kích thước pixel
Đặt chiều rộng hoặc chiều cao bạn cần — 256 cho biểu tượng ứng dụng, 2400 cho đồ họa in — và chiều còn lại sẽ theo tỷ lệ khung. Bản xuất không bao giờ bị phóng to quá kích thước mà tệp khai báo.
Xuất tệp PNG
Lưu ảnh điểm và dùng nó ở bất cứ đâu cần PNG: một slide, quy trình tạo favicon, tệp README hay danh mục cửa hàng không nhận vector.
Biến vector thành pixel
SVG là XML: các đường dẫn, màu tô và lệnh chữ mà bộ kết xuất phân giải ở bất kỳ mức thu phóng nào, vì thế logo và biểu tượng được vẽ dưới dạng vector. PNG là một lưới pixel đã hoàn thiện, nên raster hóa nghĩa là phải cố định kích thước lưới trước — mọi đường cong được lấy mẫu lên đó, và độ phân giải bạn chọn là độ phân giải bạn giữ lại.
Hình vẽ được kết xuất qua chính bộ máy SVG của trình duyệt, cùng bộ máy hiển thị nó trên trang, nên dải màu, bộ lọc và các hình bị cắt hoạt động đúng như khi xem trên màn hình, và vùng trong suốt được giữ vì PNG mang kênh alpha. Cái giá phải trả là tính cố định: phóng to tệp PNG sau đó sẽ làm cạnh mềm đi, còn kết xuất mới từ SVG ở kích thước lớn hơn thì vẫn sắc. Hãy giữ tệp vector làm bản gốc.
Câu hỏi về chuyển SVG sang PNG
Làm sao chọn độ phân giải cho tệp PNG?
Hãy nghĩ tới nơi nó sẽ xuất hiện lớn nhất: 16–64 px cho favicon, 256–512 px cho biểu tượng ứng dụng, từ 1000 px trở lên cho bản in. Đặt một chiều thì chiều kia theo tỷ lệ; xuất lại ở kích thước khác rất rẻ vì bản gốc vẫn sắc nét.
Tôi mất gì so với tệp SVG?
Khả năng thu phóng và khả năng chỉnh sửa: PNG là một lưới cố định, nên phóng to sẽ mờ, và các hình trong đó không còn là văn bản để bạn đổi kiểu. Hãy coi bản xuất là bản phân phối cho một kích thước cụ thể và giữ lại tệp .svg gốc.
Tệp SVG của tôi không có chiều rộng và chiều cao. Chuyện gì xảy ra?
Nó được kết xuất vào khung nhìn 1024 pixel, và đó trở thành kích thước nội tại, nên tệp chỉ có viewBox được coi là rộng 1024 px. Hãy đặt kích thước pixel cụ thể ở đây, hoặc thêm chiều rộng và chiều cao vào phần đánh dấu, khi bạn cần con số chính xác.
Tệp PNG có giữ vùng trong suốt không, và tệp của tôi có bị tải lên không?
Vùng trong suốt được giữ nguyên, vì PNG có kênh alpha thật — một logo trên nền xuyên thấu vẫn xuyên thấu. Cũng không có gì bị tải lên: hình vẽ được kết xuất và mã hóa ngay trong thẻ này, tối đa 64 MB mỗi tệp, và trang chạy được ngoại tuyến sau khi đã tải xong.