Logo của tôi có bị tải lên không?

Không. Icon được vẽ và đóng gói ngay trên trình duyệt, logo không rời khỏi máy bạn.

Ảnh nguồn nên thế nào?

Ảnh vuông hoặc gần vuông từ 512 px trở lên là tốt nhất. Hình đơn giản, tương phản mạnh vẫn rõ ở 16 px; chi tiết nhỏ thì không.

Có giữ nền trong suốt không?

Có. Ảnh PNG trong suốt vẫn trong suốt trong các icon PNG và khung ICO.

Có cần đủ mọi cỡ không?

Hầu hết site cần favicon.ico, một PNG 32 px, icon Apple 180 px và icon 192, 512 px cho manifest của web app. Các cỡ còn lại để bạn dùng khi cần.

Tạo favicon

Biến logo thành bộ favicon đầy đủ: icon PNG từ 16 đến 512 px, favicon.ico, file ZIP và đoạn HTML cho thẻ head.

Ảnh gốc

Các icon

Mở một logo hay ảnh gần vuông. Kéo khung vuông để chọn phần đưa vào icon.

HTML cho thẻ <head>

<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="apple-touch-icon" sizes="180x180" href="/favicon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="/favicon-192x192.png">
<link rel="icon" type="image/png" sizes="512x512" href="/favicon-512x512.png">

Chạy ngay trên trình duyệt; những gì bạn nhập không rời khỏi trang này.

Cách hoạt động

Chọn hình vuông

Mở logo hoặc ảnh rồi kéo khung vuông để chọn phần đưa vào icon. Khung luôn vuông, tối thiểu bằng một phần mười cạnh ngắn và khớp với pixel nguyên. Phần xem thử trên tab trình duyệt cho thấy icon trông thế nào ở cỡ nhỏ.

Bạn nhận được gì

Từ vùng cắt tạo ra tám cỡ PNG: 16, 32, 48, 64, 128, 180 (Apple touch), 192 (Android) và 512 (PWA). favicon.ico chứa các khung 16, 32, 48 và 64 px, còn nút tải ZIP gói tất cả lại.

Chép HTML cho ra các thẻ link để đặt vào head của trang, dùng đúng tên file trong ZIP như favicon-32x32.png. Hãy đặt các file ở thư mục gốc của site.

Công cụ khác

Tất cả 238 công cụ