Favicon Generator & Editor
Create perfect favicons for every browser and device. Upload an image, type letters or pick an emoji — customize the shape, background and effects, then download a complete favicon package ready to install.
Live preview
Google Search
yourwebsite.com
https://yourwebsite.com
Your Website — Welcome to our website
Discover our products and services. We offer the best solutions for your needs.
Browser Tab
Bookmarks Bar
Mobile Home Screen
All Sizes
<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">
100% client-side — your images never leave your device
100% secure
Your files are never shared
Ultra-fast
Processing in seconds
Privacy
Automatic deletion after 1h
How to create a favicon
Choose your source
Upload a logo image, type a letter or short text, or pick an emoji. Each mode gives you a different starting point for your favicon.
Customize the design
Adjust the shape from square to circle, add a background color or gradient, fine-tune padding, and optionally add a border or shadow.
Download & install
Download the complete favicon package (ZIP). Extract the files to your website root and paste the HTML snippet into your page's <head> tag.
Favicon sizes explained
| File | Size | Used by |
|---|---|---|
| favicon.ico | 16, 32, 48 | All browsers (legacy fallback, multi-size) |
| apple-touch-icon.png | 180×180 | iOS Safari — home screen bookmark |
| android-chrome-192.png | 192×192 | Android Chrome — home screen shortcut |
| android-chrome-512.png | 512×512 | Android Chrome — PWA splash screen |
Tips for a great favicon
- 1Keep it simple — favicons display at tiny sizes (16×16), so avoid intricate details that become unreadable.
- 2Use bold, contrasting colors — your favicon needs to stand out in a browser tab against both light and dark backgrounds.
- 3Add padding — a logo touching the edges of the shape looks cramped. 10-15% padding usually looks best.
- 4Test at all sizes — use our preview panel to verify your favicon looks sharp at 16px and 512px. What works at large sizes may not work small.
Favicon Generator & Editor — Frequently asked questions
What size should a favicon be?
Modern browsers use multiple sizes. The essential ones are: 16×16 and 32×32 for browser tabs, 180×180 for Apple Touch Icon (iOS home screen), and 192×192 / 512×512 for Android and PWA icons. Our tool generates all these sizes automatically.
What is the best format for a favicon?
Use a combination: favicon.ico (multi-size, for legacy support), PNG files for modern browsers, and optionally SVG for scalability. Our package includes all the recommended formats.
Why does my favicon look bad on Google Search results?
Google displays favicons as small circles in search results. If your favicon is a square logo without padding, it gets clipped into a circle and looks cut off. Use our editor's shape and padding controls to preview exactly how it will look in Google results, and adjust accordingly.
How do I add a favicon to my website?
Download the favicon package from our tool, extract the files to your website's root directory, and add the provided HTML snippet to the <head> section of every page. The snippet includes links for all icon sizes and the web manifest.
How do I add a favicon to WordPress?
In WordPress, go to Appearance → Customize → Site Identity → Site Icon. Upload the 512×512 PNG from our package. WordPress will automatically generate the other sizes. For full control, upload all files to your root directory and add the HTML snippet to your theme's header.php.
Can I make a favicon from text or emoji?
Yes! Our editor has three modes: Image (upload a logo), Text (type 1-3 characters with Google Fonts), and Emoji (pick any emoji). All modes include full customization of shape, background, border, and shadow.
Why isn't my favicon showing up?
Browsers aggressively cache favicons. Try: 1) Hard refresh (Ctrl+Shift+R), 2) Clear browser cache, 3) Visit your favicon URL directly (e.g., yoursite.com/favicon.ico) to verify it loads, 4) Check that the HTML link tags are correct in your page source.
Is this tool really free and private?
Yes, completely free with no limits. Everything runs in your browser — no images are uploaded anywhere. The favicon is generated using the HTML Canvas API on your device. No account required, no watermarks.