Trình tạo favicon

Tạo trọn bộ favicon từ một ảnh duy nhất — favicon.ico, apple-touch-icon, biểu tượng Android/PWA và đoạn mã HTML — hoàn toàn trong trình duyệt của bạn. Không có gì được tải lên.

Quyền riêng tư là trên hết: mỗi hình ảnh được xử lý cục bộ trong trình duyệt của bạn. Không có gì được tải lên, lưu trữ hay truyền đến bất kỳ máy chủ nào.

Mọi biểu tượng một trang web hiện đại cần, cùng lúc

Favicon không còn là một tệp duy nhất. Trình duyệt đọc một favicon.ico nhỏ cho thẻ và thanh địa chỉ, iOS muốn một apple-touch-icon 180×180 cho màn hình chính, còn Android và các web app cài đặt được thì lấy ảnh PNG 192 và 512px từ một web manifest. Trình tạo này dựng tất cả từ một ảnh nguồn và đưa cho bạn đoạn mã HTML sẵn sàng dán vào, nên bạn không phải xuất sáu kích thước bằng tay.

Căn khung theo ý bạn, riêng tư tuyệt đối

Giữ biểu tượng vuông, bo tròn góc, hoặc cắt thành hình tròn; thêm khoảng đệm để logo không bị ép sát mép; và chọn nền trong suốt hay nền đơn sắc. Bản xem trước trực tiếp cho thấy kết quả ở đúng kích thước favicon thật, gồm cả một thẻ trình duyệt mô phỏng. Vì mọi tệp đều được tạo trên thiết bị của bạn, logo của bạn — thường là bộ nhận diện chưa công bố — không bao giờ bị gửi đến máy chủ.

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

Ảnh của tôi có bị tải lên để tạo favicon không?
Không. Tệp favicon.ico, các biểu tượng PNG và tệp manifest đều được tạo cục bộ trong trình duyệt bằng Canvas API. Ảnh của bạn không bao giờ rời khỏi thiết bị.
Tôi nhận được những kích thước và tệp nào?
Một tệp favicon.ico đa độ phân giải (16, 32 và 48px), các biểu tượng PNG ở 16, 32, 48, 180 (apple-touch-icon), 192 và 512px, một tệp site.webmanifest, cùng một đoạn HTML để dán vào <head> của bạn.
Tôi có thể chuyển PNG hoặc SVG sang ICO không?
Có. Thả vào một tệp PNG, JPG, SVG hoặc WebP và tải xuống một tệp favicon.ico thực thụ. Logo SVG được raster hóa cục bộ ở độ phân giải cao trước.
Ảnh nào cho kết quả tốt nhất?
Một ảnh vuông với logo đơn giản, tương phản cao. Ảnh không vuông sẽ được cắt theo tâm cho vừa; hãy dùng các tùy chọn khoảng đệm và hình dạng để căn khung theo ý bạn.
Tôi cài đặt favicon như thế nào?
Giải nén gói vào thư mục gốc của trang web và dán đoạn HTML được cung cấp vào <head> của các trang. Tệp favicon.ico được hầu hết trình duyệt tự động nhận ra.