Tạo Favicon
Biến một ảnh duy nhất thành bộ favicon hoàn chỉnh — một tệp .ico đa kích thước, các tệp PNG cho mọi kích thước phổ biến, biểu tượng Apple touch, và các thẻ HTML sẵn sàng dán vào. Dùng khi bạn đang thiết lập website và cần biểu tượng cho tab trình duyệt lẫn màn hình chính chỉ trong một lần tải.
Các bước sử dụng
- Kéo ảnh vào vùng tải lên, hoặc nhấp để chọn tệp. Ảnh vuông định dạng PNG, JPG hoặc SVG là tốt nhất (khuyến nghị 512×512).
- Xem thẻ Xem trước, hiển thị biểu tượng của bạn ở các kích thước 64, 48, 32 và 16px.
- Sao chép các thẻ
<link>trong thẻ Thẻ HTML bằng nút Sao chép, rồi dán vào phần<head>của trang. - Nhấn Tạo bộ favicon (ZIP) và chờ tệp được tải xuống.
- Giải nén
favicon-package.zipvào thư mục gốc của website và kiểm tra đường dẫn tệp khớp với các thẻ HTML.
Mẹo
- Ảnh của bạn được thu nhỏ vừa khung (contain) và căn giữa trên nền trong suốt, nên ảnh không vuông cũng không bị kéo giãn — nhưng ảnh vuông sẽ tránh được viền trống.
- Tệp ZIP gồm
favicon.ico(gộp 16/32/48px), các PNG từ 16px đến 512px,apple-touch-icon.png(180px), và tệp tham chiếuhead-tags.html. - Các thẻ HTML kèm theo giả định biểu tượng nằm ở thư mục gốc website (ví dụ
/favicon.ico); hãy chỉnh đường dẫnhrefnếu bạn đặt chúng trong thư mục con.
Câu hỏi thường gặp
Tệp ZIP gồm những gì?
favicon.ico (một tệp gộp 16, 32 và 48px), các PNG riêng lẻ ở 16, 32, 48, 64, 96, 128, 180, 192, 256 và 512px, một apple-touch-icon.png, cùng head-tags.html chứa mã đánh dấu.
Tôi có cần ảnh vuông không?
Không bắt buộc, nhưng nên dùng. Công cụ đặt mọi ảnh vừa trong khung vuông và căn giữa, nên ảnh không vuông sẽ có phần đệm trong suốt xung quanh.
Đặt các thẻ HTML ở đâu?
Dán chúng vào bên trong phần <head> của HTML. Hãy đảm bảo các tệp biểu tượng truy cập được theo đúng đường dẫn hiển thị (mặc định trỏ về thư mục gốc website).