SVG và PNG khác nhau thế nào? Logo nên dùng định dạng nào?

SVG và PNG đều hỗ trợ nền trong suốt và đều phổ biến trên web, nhưng cách chúng lưu hình ảnh hoàn toàn khác nhau.

Trả lời nhanh

SVG là định dạng đồ họa vector, phù hợp với logo, icon, sơ đồ và hình có đường nét cần phóng to mà vẫn sắc. PNG là ảnh raster theo pixel, phù hợp với screenshot, ảnh có nhiều chi tiết raster hoặc trường hợp cần một bitmap cố định. Nếu bạn có file vector gốc của logo, SVG thường là lựa chọn linh hoạt hơn cho web.

SVG là gì?

SVG là Scalable Vector Graphics. Theo W3C, SVG mô tả đồ họa hai chiều bằng cấu trúc vector, text và các đối tượng có thể được style, transform và scale.

Điểm quan trọng là SVG không phụ thuộc vào một lưới pixel cố định như PNG. Một logo vector có thể được hiển thị ở kích thước nhỏ trên menu hoặc lớn trên màn hình độ phân giải cao mà vẫn giữ cạnh sắc.

PNG là gì?

PNG là định dạng raster. Hình ảnh được tạo từ một số lượng pixel xác định. PNG hỗ trợ transparency và nén không mất dữ liệu, vì vậy thường phù hợp với screenshot, UI, biểu đồ raster và đồ họa cần giữ pixel chính xác.

Nếu phóng một PNG nhỏ quá lớn, bạn sẽ bắt đầu thấy pixel hoặc hình bị mềm.

Logo nên dùng SVG hay PNG?

Nếu logo được thiết kế bằng vector, SVG thường phù hợp cho website vì:

• scale tốt trên màn hình mật độ điểm ảnh cao;
• thích hợp với icon và logo;
• có thể giữ nền trong suốt;
• dễ dùng ở nhiều kích thước.

PNG vẫn cần thiết khi nền tảng không nhận SVG hoặc khi bạn cần một kích thước pixel cố định, ví dụ upload lên một số marketplace, profile image hoặc phần mềm cũ.

Chuyển PNG sang SVG có biến ảnh thành vector thật không?

Đây là câu hỏi rất quan trọng. Đổi phần mở rộng hoặc bọc bitmap vào SVG không tự biến mọi đường nét trong PNG thành vector. Để có vector thật, cần quá trình vectorization/tracing nhận diện đường, shape và vùng màu.

Vì vậy, sau khi chuyển PNG → SVG, hãy zoom lớn để kiểm tra xem nội dung có thực sự được vector hóa hay chỉ là ảnh raster nằm trong một container SVG.

ReFormatic có trang PNG → SVG và cũng hỗ trợ SVG → PNG cho trường hợp nền tảng yêu cầu raster.

Khi nào nên chuyển SVG sang PNG?

Chuyển khi:

• dịch vụ upload không hỗ trợ SVG;
• cần thumbnail raster cố định;
• cần gửi ảnh cho ứng dụng chỉ chấp nhận PNG/JPG;
• cần kích thước pixel chính xác.

Hãy xuất PNG ở kích thước đủ lớn ngay từ nguồn SVG thay vì lấy một PNG nhỏ rồi phóng to.

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

SVG có sắc nét hơn PNG không?

Với đồ họa vector như logo và icon, SVG có thể scale mà không phụ thuộc vào độ phân giải pixel cố định. PNG chỉ sắc ở phạm vi kích thước tương ứng với số pixel của nó.

SVG có phù hợp với ảnh chụp không?

Thông thường không. Ảnh chụp phức tạp phù hợp hơn với các định dạng raster như JPG, WebP hoặc AVIF.

PNG có hỗ trợ nền trong suốt không?

Có. Đây là một trong những lý do PNG vẫn rất hữu ích cho logo raster và UI asset.

Kết luận

Dùng SVG cho logo, icon và hình vector cần scale linh hoạt. Dùng PNG khi cần bitmap cố định, screenshot hoặc tương thích với hệ thống không nhận SVG. Nếu chuyển giữa hai định dạng, hãy hiểu rõ rằng raster hóa SVG và vector hóa PNG là hai quá trình khác nhau.