Công cụ tạo favicon
Tạo mọi favicon trang web của bạn cần chỉ từ một ảnh.
Cách sử dụng Tạo favicon
Thêm logo hoặc ảnh
Kéo thả ảnh PNG, JPG, WebP, GIF hoặc SVG vào trang. Ảnh vuông với hình đơn giản cho kết quả tốt nhất.
Điều chỉnh giao diện
Cắt thành hình vuông hoặc hiện toàn bộ ảnh, chọn nền trong suốt hoặc có màu, thêm khoảng đệm và bo góc. Bản xem trước hiện từng kích thước và một tab trình duyệt.
Tải xuống và thêm mã
Tải file ZIP, tải các file lên thư mục gốc của trang web và dán các dòng HTML vào phần head của các trang.
Tại sao nên dùng Utils365
Bộ đầy đủ
favicon.ico chứa 16, 32 và 48 px, favicon PNG, Apple touch icon, icon Android và site.webmanifest, tất cả được đặt tên đúng như trình duyệt cần.
Xem trước khi tải
Kiểm tra icon ở kích thước thật và trên tab trình duyệt sáng và tối, để chi tiết nhỏ không bị mất.
Riêng tư ngay từ thiết kế
Mọi thứ diễn ra trên trình duyệt, nên logo của bạn không bao giờ bị tải lên máy chủ.
Các câu hỏi thường gặp
Tôi cần favicon ở những kích thước nào?
favicon.ico (16, 32 và 48 px) dùng cho tab trình duyệt và dấu trang, Apple touch icon 180 px dùng cho màn hình chính iPhone và iPad, và PNG 192 và 512 px dùng cho Android và ứng dụng web đã cài. Công cụ này tạo tất cả từ một ảnh.
ICO, PNG hay SVG: nên dùng định dạng favicon nào?
Dùng cả ba. favicon.ico hoạt động ở mọi nơi, kể cả trình duyệt cũ và các công cụ tự động tìm nó. Favicon PNG cho hình sắc nét ở các kích thước cố định. Favicon SVG sắc nét ở mọi kích thước; bạn nhận được nó khi bắt đầu từ một file SVG.
apple-touch-icon là gì?
Đó là icon iPhone và iPad dùng khi ai đó thêm trang của bạn vào màn hình chính. Nó có kích thước 180 × 180 px và không thể trong suốt, nên được lưu với nền đặc (màu trắng nếu bạn chọn trong suốt). iOS tự bo góc.
Đặt các file favicon ở đâu?
Giải nén chúng vào thư mục gốc của trang web, cạnh trang chủ, để favicon.ico nằm ở yoursite.com/favicon.ico. Sau đó dán các dòng HTML hiển thị trên trang này vào phần head của mọi trang, hoặc vào template của trang web.
Vì sao favicon mới không hiện?
Trình duyệt lưu favicon trong thời gian dài. Hãy mở trực tiếp địa chỉ của favicon, làm mới cứng (hard refresh), hoặc thử cửa sổ ẩn danh để xem favicon mới.