Every favicon size from one image
Hand-exporting six icon sizes per site is tedious. Drop one image and get 16–512px PNGs, the Apple touch icon, and site.webmanifest zipped in seconds.
Drop a square image — get every favicon size plus site.webmanifest as a ZIP.
Bao gồm favicon.ico, site.webmanifest + đoạn mã HTML
What you can do with Trình tạo Favicon
Everything this tool helps you accomplish — no learning curve, no setup.
- Generate every favicon size from one image
- Create Apple touch and Android home-screen icons
- Get a ready-to-use site.webmanifest file
- Download all favicon sizes as a single ZIP
- Add a crisp browser-tab icon to your website
Xong với Trình tạo Favicon rồi? Hãy thử những công cụ này tiếp theo
Những công cụ được chọn lọc kết hợp tốt với Trình tạo Favicon. Tiếp tục làm việc mà không mất tệp của bạn.
Trình chuyển đổi ICO
Windows and browsers need .ico, not PNG. Convert PNG, JPG, or SVG into one multi-resolution .ico (16–256 px) ready for favicons and desktop apps in seconds.
Dùng thử ngaySVG sang PNG
Slack, docs, and most apps can't use SVG. Export your vector as a sharp PNG at 1×–8× scale with a transparent, white, or custom background — in seconds.
Dùng thử ngayPNG sang WebP
PNGs are bloating your page load. Convert them to WebP at a fraction of the size with every transparent pixel intact — in seconds.
Dùng thử ngayẢnh sang nhãn dán
Plain photos look out of place in chats. Cut the background, wrap a white outline around your subject, and export a sticker sized for WhatsApp, Telegram, and iMessage in seconds. Free to start.
Dùng thử ngayThay đổi kích thước ảnh
Wrong size for the platform? Set exact width and height or scale by percent, preview live, and download without quality loss — in seconds. Free to start; batch resize with Premium.
Dùng thử ngayTrình chọn màu
Stop guessing HEX codes from screenshots. Click any pixel for HEX, RGB, and HSL, or extract the dominant palette as JSON or CSS variables, right in your browser.
Dùng thử ngayCâu hỏi thường gặp
Với các trình duyệt và thiết bị hiện đại, bạn cần sáu kích thước: 16×16 và 32×32 cho tab trình duyệt, 48×48 cho biểu tượng trang web Windows, 180×180 cho Apple touch icon (màn hình chính iOS), và 192×192 + 512×512 cho màn hình chính Android và lời nhắc cài đặt PWA. Trình tạo của chúng tôi tạo ra cả sáu kích thước cùng một file site.webmanifest từ một ảnh nguồn duy nhất.
usageHầu hết trình duyệt hiện đại ưu tiên thẻ link PNG (rel="icon" type="image/png"), nên không còn cần file ICO nữa. Chúng tôi bỏ qua ICO cũ và cung cấp favicon PNG với kích thước chính xác cho mọi mục tiêu hiện đại. Nếu bạn buộc phải hỗ trợ Internet Explorer hoặc Chrome rất cũ, bạn có thể chuyển một trong các file PNG sang ICO riêng.
technicalMột web app manifest là một tệp JSON cho Android, Chrome và Edge biết trang web của bạn nên trông như thế nào khi được cài đặt dưới dạng ứng dụng web tiến bộ (PWA) — biểu tượng, tên, màu chủ đề và chế độ hiển thị. Trình tạo của chúng tôi bao gồm một manifest khởi đầu trỏ tới các biểu tượng Android Chrome; bạn chỉ cần chỉnh sửa tên và theme_color.
featuresMột ảnh PNG vuông (1:1) ở kích thước 512×512 trở lên cho kết quả sạch nhất ở mọi kích cỡ. Tránh các chi tiết nhỏ sẽ biến mất ở 16×16 — favicon hoạt động tốt nhất với một hình khối đậm đơn giản và độ tương phản cao. PNG nền trong suốt vẫn dùng được; công cụ thêm viền để biểu tượng nằm chính giữa ở mọi kích cỡ.
tipsẢnh nguồn của bạn được tải lên qua HTTPS đến máy chủ bảo mật của chúng tôi, nơi kết xuất mọi kích thước favicon và site.webmanifest rồi trả về dưới dạng một tệp ZIP, sau đó tự động xóa bản tải lên sau khi xử lý. Các bản tải xuống không có watermark và không có gì được lưu trữ hay chia sẻ, nên nó luôn an toàn cho các sản phẩm chưa ra mắt và nhận diện thương hiệu trước khi ra mắt.
privacyGiải nén tệp tải về vào thư mục /public (hoặc thư mục gốc web) của trang web, sau đó thêm đoạn mã HTML kèm theo vào <head>: các thẻ link cho biểu tượng PNG cùng một liên kết tới site.webmanifest. Hãy làm mới cứng trang web (Cmd+Shift+R) — trình duyệt lưu cache favicon rất mạnh, nên bạn có thể cần xóa cache để biểu tượng mới hiển thị.
usageCó — các tệp PNG 192×192 và 512×512 chính là thứ Chrome và Edge tìm kiếm để công nhận một trang là PWA có thể cài đặt. Cùng với tệp manifest, chúng đáp ứng bài kiểm tra khả năng cài đặt PWA của Lighthouse.
technicalYes. Preview the favicon set before signup, then create a free account to download the ZIP without a watermark. The icon set is rendered on our servers, so signed-in free use has an allowance and Premium removes the cap.
pricingFavicon là biểu tượng nhỏ mà trình duyệt hiển thị bên cạnh tiêu đề trang trên tab, trong dấu trang và trong lịch sử. Nó cũng được dùng làm biểu tượng khi ai đó thêm trang web của bạn vào màn hình chính điện thoại hoặc cài đặt nó như một ứng dụng. Tải logo lên đây và bộ tạo sẽ tạo ra đầy đủ các kích thước favicon cùng một site.webmanifest trong một tệp ZIP.
usageCó — trình tải lên chấp nhận các tệp nguồn PNG, JPEG, WebP và SVG, không chỉ PNG. SVG đáng dùng nếu bạn có: vì nó là vector, mọi kích thước đầu ra từ 16 đến 512 đều được dựng mới từ dữ liệu vector thay vì được phóng to từ ảnh raster, nên các cạnh vẫn sắc nét ngay cả ở 512×512. JPEG và WebP cũng dùng tốt, mặc dù bạn nên làm phẳng mọi độ trong suốt lên một nền trước vì JPEG không thể giữ một kênh alpha.
technicalTải lên logo PNG của bạn và công cụ tạo sẽ xuất ra file favicon.ico đa độ phân giải chứa các phiên bản 16, 32 và 48 pixel mà trình duyệt yêu cầu, cùng với sáu kích thước PNG và site.webmanifest, tất cả đóng gói trong một file ZIP. Nguồn JPEG, WebP và SVG cũng hoạt động tốt, nên bất kỳ file logo nào cũng có thể chuyển thành favicon mà không cần mở trình chỉnh sửa ảnh.
usageTrình tạo Favicon giúp bạn hoàn thành công việc như thế nào
Những vấn đề thực tế mà công cụ này giải quyết mỗi ngày — cho doanh nghiệp, người sáng tạo và các tác vụ thường ngày. Tìm trường hợp sử dụng phù hợp với bạn và bắt đầu trong vài giây.
Ra mắt sản phẩm indie hacker
Nhà sáng lập đơn lẻ đang ra mắt MVP cần một favicon chỉn chu trước khi phát hành. Tạo mọi kích thước từ một ảnh logo duy nhất cùng tệp manifest chỉ bằng một cú nhấp — không cần Figma, không cần gói thiết kế trả phí.
Thiết lập khách hàng cho agency
Khi bàn giao một trang web mới cho khách hàng, bộ favicon hiếm khi được tính vào ngân sách nhưng luôn được kỳ vọng. Hãy tạo tệp ZIP vào cuối dự án, thả nó vào /public và đánh dấu hoàn thành sản phẩm bàn giao.
Khả năng cài đặt PWA
Để vượt qua kiểm tra khả năng cài đặt của Chrome, tệp manifest của bạn cần các biểu tượng 192×192 và 512×512. Đầu ra của chúng tôi đáp ứng yêu cầu đó ngay từ đầu, cùng với các thẻ HTML head tương ứng.
Không gian làm việc đa thương hiệu
Các agency và chuyên viên tư vấn quản lý nhiều thương hiệu khách hàng có thể tạo lại bộ favicon trong 10 giây mỗi khi thương hiệu đổi mới — không cần duy trì một action Photoshop.
Xây Dựng Thương Hiệu Dự Án Mã Nguồn Mở
Các trang trên GitHub Pages, Vercel, Netlify và Cloudflare Pages đều cần favicon để trông chỉn chu trên tab trình duyệt. Hãy thả các file đã tạo vào kho lưu trữ của bạn và dự án của bạn trông như đã hoàn thiện.
Làm mới thương hiệu
Khi logo của bạn thay đổi, hãy tạo lại mọi kích thước cần thiết — bao gồm biểu tượng Apple touch 180px và biểu tượng Android PWA 512px — mà không cần xuất lại thủ công từ Illustrator.
Biểu tượng cho Manifest tiện ích mở rộng trình duyệt
Lấy các PNG 16, 32 và 48px thẳng từ ZIP cho đối tượng icons trong manifest.json của bạn — một cách nhanh để có biểu tượng tiện ích mở rộng đúng chuẩn mà không cần xuất từng kích thước bằng tay trong công cụ thiết kế.
Lấp khoảng trống Favicon trên các trang No-Code
Webflow, Framer và Wix hiếm khi tự tạo được bộ favicon đầy đủ; hãy tải logo của bạn lên đây rồi dán các kích thước và đoạn HTML kết quả vào bảng cài đặt mã tùy chỉnh hoặc SEO của trang chỉ trong vài phút.
Tạo vẻ hoàn thiện cho blog sở thích
Các blog cá nhân trên Ghost, Jekyll hay Hugo thường không có favicon nào cả; hãy tạo bộ đầy đủ từ ảnh chân dung hoặc logo vẽ tay để tab trình duyệt trông có chủ đích thay vì trống trơn.
Sửa Favicon bị đánh dấu trong đánh giá SEO
Một favicon bị thiếu hoặc lỗi là dấu hiệu thường gặp trong báo cáo của Lighthouse và các trình thu thập SEO, và nó âm thầm làm giảm tỷ lệ nhấp trong kết quả tìm kiếm cũng như dấu trang. Hãy tạo lại toàn bộ bộ biểu tượng chỉ với một lần tải lên và xử lý dứt điểm vấn đề đó ngay hôm nay.