RootUtils

Favicon Gen

Client-Side Secure

Free online Favicon Generator. Create icons for Web, iOS, and Android from text or images. Download a complete icon package instantly.

Click to Upload

Recommended: 512x512 PNG

Style Settings

Browser Tab Preview

My Awesome Website

Google Result Preview

My Website
https://www.example.com
My Awesome Website - The Best Tools Online

Ready to Launch?

Includes all sizes + webmanifest

head.html
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">

Files in Zip

favicon.icosite.webmanifestfavicon-16x16.pngfavicon-32x32.pngapple-touch-icon.pngandroid-chrome-192x192.pngandroid-chrome-512x512.png

Is this tool broken?

Let us know if you found a bug or have a feature request.

The Ultimate Favicon Converter & Generator

Generate pixel-perfect icons for your website in seconds. Whether you need a classic .ico for desktop browsers, a high-res PNG for Google results, or an Apple Touch Icon for iOS home screens, RootUtils creates them all in a single zip file.

Don't have a logo? Use our Emoji Mode to turn any emoji into a professional favicon instantly.

Favicon Size Cheat Sheet

File NameSize (px)Purpose
favicon.ico32x32Legacy support for older browsers and IE.
favicon-32x32.png32x32Standard desktop browser tabs (Retina compatible).
apple-touch-icon.png180x180iPhone and iPad Home Screen shortcuts (iOS).
android-chrome-*.png192x192 / 512x512Android Home Screen & PWA (Progressive Web App) Manifest.

How to Install Your Favicon

1

Download & Unzip

Click the "Download Zip" button above. Extract the files to a folder on your computer.

2

Upload to Root

Upload all the image files and the site.webmanifest file to the root directory of your website (e.g., public/ folder in Next.js/React, or the main folder in HTML).

3

Add HTML Tags

Copy the HTML code provided in the tool and paste it into the <head> section of your website's main template.

Frequently Asked Questions

Why isn't my favicon showing up?

Browsers cache favicons aggressively. If you updated your icon but don't see the change, try opening your site in an Incognito Window or doing a hard refresh (Ctrl+F5).

Do I really need the .ico file?

For modern browsers (Chrome, Firefox, Safari), PNGs are preferred. However, favicon.ico is still recommended as a fallback for very old browser versions and some legacy tools.

What is the site.webmanifest?

It is a simple JSON file that tells Android devices how your website should behave when saved to the home screen (e.g., the app name, icon, and theme color).