Image, text or emoji
Upload a logo, type one to three letters with your own font and colors, or turn any emoji into a favicon.
Your siteEvery size, one click
Favicon Generator favicon.ico, PNG, SVG and Apple touch icons
Create a complete favicon set from an image, a few letters or an emoji. Preview it in browser tabs, search results and phone home screens, then download a ZIP with the HTML code ready to paste.
- Image, text or emoji
- All sizes
- HTML and manifest
- No upload
Create your favicon
Make it from
Text color
Type or paste any emoji, or pick one below. Emoji look slightly different on each device.
Drop a logo or image here, or click to choosePNG, SVG, JPG or WebP. Square images with transparency work best. You can also paste.
Shape
Background
Website name, theme color and file path
Theme color
Live preview
Upload the files to your website's root folder, then paste this code inside the <head> of every page.
Why it's better
Why this favicon generator is better
Most favicon makers either need an existing image or only give you a single .ico file. This one designs, previews and packages everything a modern website needs.
The complete set
A multi-size favicon.ico, 16 and 32 pixel PNGs, an Apple touch icon, Android and PWA icons and an SVG favicon.
Realistic previews
See your icon in light and dark browser tabs, a search result and iPhone and Android home screens, or right in this tab.
HTML and manifest included
Copy ready-made head tags, and get a site.webmanifest with your site name and theme color filled in.
One ZIP download
Download every file in a single ZIP, or save the individual files you need.
Private and instant
Everything is drawn in your browser. Your logo is never uploaded, and there's no sign-up or watermark.
How it compares with typical favicon generators
| Feature | This favicon generator | Typical favicon sites |
|---|---|---|
| Create from text or emoji | Yes | Sometimes |
| Multi-size favicon.ico | 16, 32 and 48 px | Often one size |
| SVG favicon | Yes, for text and emoji | Rarely |
| Tab, search and home screen previews | All of them | Rarely |
| HTML code and web manifest | Yes | Sometimes |
| Image uploaded to a server | Never | Usually |
How to use
How to make a favicon
Design, preview and download your favicon set in under a minute.
Setting up a new site? Write your title and description tags with the meta tag generator, and pick exact brand colors with the image color picker.
Choose a source
Pick Text for initials, Emoji for a fun icon, or Image to use your logo.
Style it
Set the shape, corner radius, padding, background color or gradient, or keep the background transparent.
Check the previews
Look at the tiny 16 pixel tab icon especially, and turn on the live tab preview to see it for real.
Add your site details
Enter your site name, theme color and file path so the manifest and HTML code are ready to use.
Download and install
Download the ZIP, upload the files to your site and paste the HTML into your page's head section.
Favicon sizes
Favicon sizes and files explained
Different browsers and devices look for different files. Here's what each one in your download is for.
| File | Size | Used by |
|---|---|---|
favicon.ico | 16, 32 and 48 px | All browsers, bookmarks and tools that request /favicon.ico automatically |
favicon.svg | Scalable | Modern browsers, stays sharp at any size (text and emoji icons) |
favicon-32x32.png | 32 px | Browser tabs on high-resolution screens |
favicon-16x16.png | 16 px | Browser tabs on standard screens |
apple-touch-icon.png | 180 px | iPhone and iPad home screen shortcuts |
android-chrome-192x192.png | 192 px | Android home screen and installed web apps |
android-chrome-512x512.png | 512 px | Web app splash screens and app stores for PWAs |
site.webmanifest | Text file | Tells Android and browsers your app name, icons and colors |
Design tips
How to design a favicon that stands out
A favicon is often shown at just 16 by 16 pixels, smaller than a single letter on this page. Designs that look great as a big logo can turn into a blur in a crowded tab bar.
Using WordPress? You can also upload the 512 pixel icon under Appearance, Customize, Site Identity, Site Icon, and WordPress will create the smaller sizes for you.
- Use one bold letter, symbol or simplified logo mark rather than your full logo.
- Choose strong contrast between the icon and its background.
- Check that it works in both light and dark browser tabs.
- Avoid thin lines and small text; they disappear at 16 pixels.
- Give Apple touch icons a solid background, since iOS fills transparency with black.
- Keep the style consistent with your brand colors.
FAQ
Favicon generator FAQ
What is a favicon?
A favicon is the small icon shown in browser tabs, bookmarks, history and search results next to your site's name. It helps people recognise your website at a glance.
What size should a favicon be?
A modern set includes a favicon.ico with 16, 32 and 48 pixel images, a 180 pixel Apple touch icon, and 192 and 512 pixel icons for Android. This generator creates all of them at once.
How do I add a favicon to my website?
Upload the files to your site's root folder and paste the generated HTML into the head section of every page. In WordPress, you can instead upload the 512 pixel icon under Appearance, Customize, Site Identity, Site Icon.
Can I make a favicon from text or an emoji?
Yes. Choose Text to use one to three letters with your own colors, font and shape, or Emoji to turn any emoji into a favicon, including an SVG version.
Do I still need a favicon.ico file?
It's still the safest choice, because some browsers and tools request /favicon.ico automatically. Modern browsers also use the PNG and SVG versions.
Why isn't my new favicon showing?
Browsers cache favicons for a long time. Hard refresh the page, clear the cache or open your site in a private window, and check that the file paths in your HTML are correct.
Will Google show my favicon in search results?
Google can show your favicon next to your site in search results when it's linked from your homepage, is square and is at least 48 pixels. The icons in this set meet those requirements.
Is my logo uploaded anywhere?
No. All icons are drawn and packaged in your browser, so your image never leaves your device.
What makes a good favicon?
Keep it simple: one bold letter, symbol or logo mark with strong contrast. Fine detail disappears at 16 pixels, so always check the small tab preview.
Create your favicon now
Design it from an image, text or emoji and download the complete set with the code. Free, instant and private.
Make a faviconMore website and image tools