Cách sử dụng
- Chọn Chữ / emoji và nhập một đến ba ký tự, hoặc chọn Ảnh và tải logo lên (tốt nhất là SVG hoặc PNG vuông ít nhất 512 px).
- Chọn màu và hình dạng — vuông, bo góc hoặc tròn.
- Kiểm tra bản xem trước ở 16, 32, 64 và 128 px; kích thước nhỏ cho thấy thiết kế còn dễ nhìn hay không.
- Tải gói ZIP, tải các tệp lên thư mục gốc của website và dán đoạn HTML vào phần head.
Giải thích tùy chọn
- favicon.ico
- Chứa các phiên bản 16, 32 và 48 px cho trình duyệt, dấu trang và lối tắt Windows.
- apple-touch-icon.png
- 180 × 180 px với nền đặc, dùng khi ai đó thêm website của bạn vào màn hình chính iPhone hoặc iPad.
- icon-192.png / icon-512.png
- Được khai báo trong site.webmanifest cho màn hình chính Android và ứng dụng web cài đặt được.
- icon.svg
- Icon co giãn được cho trình duyệt hiện đại, có trong gói khi nguồn là chữ hoặc tệp SVG.
Đoạn HTML
Sau khi tải các tệp lên thư mục gốc của website, hãy thêm đoạn này vào phần head của mọi trang:
<link rel="icon" href="/favicon.ico" sizes="32x32">
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">Câu hỏi thường gặp
Tôi thực sự cần những tệp nào?
favicon.ico ở thư mục gốc của website là đủ cho mọi trình duyệt. Thêm apple-touch-icon.png cho iOS và manifest với icon 192/512 nếu bạn muốn có icon đẹp khi website được cài đặt hoặc ghim trên Android.
Vì sao favicon trông bị mờ ở 16 px?
Chi tiết nhỏ sẽ biến mất ở 16 × 16 pixel. Hãy dùng một chữ cái đậm hoặc biểu tượng logo đơn giản thay vì toàn bộ logo kèm chữ.
Tôi đã cập nhật favicon nhưng vẫn thấy cái cũ.
Trình duyệt lưu bộ nhớ đệm favicon rất lâu. Hãy tải lại trang hoàn toàn (hard reload), hoặc thêm tham số phiên bản như /favicon.ico?v=2 vào các thẻ link.
Có dùng emoji làm favicon được không?
Được. Emoji được vẽ bằng phông emoji của hệ thống, nên kết quả khớp với những gì bạn thấy trong bản xem trước.
Quyền riêng tư
Công cụ này chạy hoàn toàn trong trình duyệt của bạn. Tệp và văn bản được xử lý ngay trên thiết bị và không bao giờ được tải lên máy chủ của chúng tôi.