Cách thêm Favicon trong HTML
Ba thẻ bao gồm 99% trường hợp. Hai cái nữa cung cấp cho bạn thiết lập cấp PWA đầy đủ.
Check favicons on any website
Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.
Thẻ tối thiểu
<link rel="icon" href="/favicon.ico"> — thế thôi. Mọi trình duyệt sẽ tìm nạp nó.
Bộ đề xuất hiện đại
Thêm SVG và apple-touch-icon để hiển thị sắc nét trên mọi nền tảng:
<link rel="icon" href="/favicon.ico">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<link rel="apple-touch-icon" size="180x180" href="/apple-touch-icon.png">
Lời nhắc cài đặt PWA
Thêm một tệp kê khai.json với các mục nhập 192×192 và 512×512 PNG, sau đó liên kết <link rel="manifest" href="/site.webmanifest">.
Câu hỏi thường gặp
What is the minimum HTML tag for a favicon?
Add <link rel="icon" href="/favicon.ico"> inside <head>. Place favicon.ico at your site root and every browser will find it.
Do I need separate tags for PNG and SVG favicons?
Yes for a modern setup. Link favicon.ico as the fallback, then add <link rel="icon" type="image/png"> and optionally type="image/svg+xml" for sharper rendering.
Where should favicon <link> tags go in HTML?
Inside the <head> element, before </head>. Order among icon links does not matter.
Do I need a web manifest for favicons?
Not for basic tabs, but add <link rel="manifest"> plus 192×192 and 512×512 PNG icons if you want PWA install prompts.