Tạo Favicon
Tạo mọi kích thước favicon mà một website cần từ duy nhất một ảnh nguồn, bao gồm cả tệp ICO đa độ phân giải. Trình duyệt, dấu trang, màn hình chính trên điện thoại và thanh thẻ đều cần kích thước khác nhau, và công cụ này tạo trọn bộ chỉ trong một lần. Công cụ miễn phí, không cần tài khoản và không thêm watermark vào kết quả của bạn.
Tạo Favicon
Thêm file của bạn. Thiết lập đề xuất đã sẵn sàng, bạn có thể xử lý chỉ với một cú nhấp.
PDF, Word, ảnh, âm thanh, video, file nén và hơn nữa
Tối đa 100 file · 250 MB · Không cần tài khoản- 1Thêm file
- 2Chọn một thao tác
- 3Tải về hoặc làm tiếp
Khi nào bạn cần
Cách hoạt động
Ảnh được đặt giữa một hình vuông trong suốt, không bao giờ bị cắt, rồi lấy mẫu lại theo từng kích thước chuẩn; ảnh nguồn nhỏ được phóng to để vẫn tạo đủ mọi kích thước. Apple touch icon được lót màu chủ đề phía sau, vì iOS biến phần trong suốt thành màu đen. Các icon PNG, một favicon.ico nhiều độ phân giải, tệp manifest và các thẻ để dán được gửi cùng trong một ZIP.
Ở kích thước 16 × 16 điểm ảnh, chi tiết sẽ biến mất. Những biểu tượng được thiết kế theo lối tối giản dễ nhận ra hơn nhiều so với logo nhiều chi tiết hay ảnh chụp bị thu nhỏ.
File ZIP gồm những gì
| File | Kích thước | Được dùng bởi |
|---|---|---|
| favicon.ico | 16, 32, 48 và 64 px | Tab và dấu trang trình duyệt, cùng mọi thứ yêu cầu trực tiếp /favicon.ico |
| favicon-16x16.png, favicon-32x32.png | 16 và 32 px | Tab trình duyệt, thông qua các thẻ trong head-snippet.html |
| favicon-48x48.png | 48 px | Một PNG dự phòng cho CMS hoặc công cụ yêu cầu đúng kích thước đó |
| apple-touch-icon.png | 180 px | Màn hình chính iPhone và iPad |
| android-chrome-192x192.png, android-chrome-512x512.png | 192 và 512 px | Màn hình chính Android và ứng dụng web cài đặt được, thông qua site.webmanifest |
| site.webmanifest | - | Tên trang, màu chủ đề và icon Android |
| head-snippet.html | - | Đúng các thẻ cần dán vào <head> của trang |
Cài đặt bộ icon
- Tải tất cả file lên thư mục gốc của trang, để https://trangcuaban.com/favicon.ico mở được icon.
- Dán nội dung head-snippet.html vào <head> của mọi trang, hoặc một lần trong template của trang.
- Tên trang và màu chủ đề bạn nhập được ghi vào site.webmanifest và thẻ theme-color.
- Trình duyệt lưu đệm favicon rất lâu. Hãy kiểm tra icon mới trong cửa sổ ẩn danh trước khi kết luận là chưa được.
Để có kết quả sắc nét
- Ảnh ngang hoặc dọc được đặt vừa trong hình vuông với khoảng trong suốt xung quanh, không bao giờ bị cắt. Hãy cắt trước lấy phần biểu tượng nếu bạn muốn logo lấp đầy icon.
- Bắt đầu từ ảnh tối thiểu 512 × 512 px, bằng kích thước icon lớn nhất trong bộ. Ảnh nhỏ hơn vẫn có đủ mọi kích thước, được phóng to.
- iOS hiển thị phần trong suốt của icon màn hình chính thành màu đen, nên apple-touch-icon.png được lót màu chủ đề của bạn; các icon khác vẫn giữ nền trong suốt.
- Với icon ứng dụng Windows có kích thước 128 và 256 px, hãy dùng Chuyển Ảnh sang ICO; bộ này dành cho website.
Câu hỏi thường gặp
Tôi nên dùng ảnh nguồn như thế nào?
Một ảnh vuông, tối thiểu 512 × 512, với hình khối đơn giản và dứt khoát. Chi tiết nhỏ và chữ nhỏ sẽ biến mất ở kích thước favicon.
Tôi có còn cần tệp ICO không?
ICO vẫn là lựa chọn tương thích rộng rãi nhất, đặc biệt với các trình duyệt cũ, nên tệp ICO được tạo kèm cùng các kích thước PNG.
Làm sao tạo favicon.ico từ ảnh PNG hoặc JPG?
Thêm ảnh và tải về tệp ZIP. favicon.ico bên trong chứa các bản 16, 32, 48 và 64 px, cùng các icon PNG cho trình duyệt, iPhone và Android, tệp manifest và các thẻ để dán vào trang của bạn.
Logo của tôi nằm ngang. Có bị cắt mất không?
Không. Ảnh ngang hoặc dọc được đặt vừa trong hình vuông với khoảng trong suốt xung quanh, nên không mất chữ nào của logo chữ. Để icon rõ nét hơn, hãy cắt logo lấy phần biểu tượng trước.
Nền trong suốt có được giữ lại không?
Có, trong favicon.ico và các icon PNG, nên icon hiển thị đẹp trên thanh tab sáng lẫn tối. Ngoại lệ là Apple touch icon: iOS sẽ hiện phần trong suốt thành màu đen, nên icon này được lót màu chủ đề của bạn.
Công cụ miễn phí liên quan
Mở file .ico, xem mọi kích thước bên trong, lưu thành PNG và thêm hoặc xóa kích thước.
Chuyển ảnh PNG, JPG hoặc WebP thành tệp biểu tượng ICO đa kích thước cho Windows.
Thay đổi kích thước ảnh theo pixel hoặc phần trăm, giữ nguyên tỷ lệ khung hình.
Bo tròn góc ảnh và tải về PNG hoặc WebP trong suốt. Góc bo tròn, dạng squircle hoặc hình tròn, có xem trước trực tiếp. Miễn phí, không cần tài khoản.
Gộp nhiều ảnh thành một sprite sheet PNG giữ nền trong suốt, kèm bản đồ JSON ghi vị trí và kích thước từng ảnh. Miễn phí, không cần tài khoản.