Free Online Tool

Favicon Generator

Generate all the favicon sizes your website needs from any image — with ready-to-paste HTML code and a downloadable ZIP. 100% in your browser, no upload.

100% private
All sizes included
Ready-made HTML

Favicon Generator

Runs in your browser

Drop your image here

or browse files from your device

JPG, PNG, WebP, SVG · Max 10 MB
Favicon Preview
Your Website
Other tab
logo.png
—

HTML Code


All favicon sizes generated — click "Download ZIP" to get them all.

Background

Fill color Replaces transparent areas.

Padding

0%

Adds space around your image — useful for small favicons.

Shape

What Is a Favicon and Why Do You Need One?

Favicon (short for "favorite icon") is a small square image that appears in:

  • Browser tabs — next to the page title
  • Bookmarks — as the icon in bookmark folders
  • Browser history — easy visual identification
  • Mobile home screens — when someone saves your site as a shortcut
  • Google search results — mobile search shows favicons next to results
  • PWA icons — when installed as a progressive web app

Why it matters:

  • Brand recognition — users instantly identify your site among open tabs
  • Professional appearance — missing favicon looks unfinished
  • SEO signal — Google shows favicons in mobile search results (CTR boost)
  • Trust — users trust sites with proper branding

Do you actually need all sizes?

Yes — different platforms use different sizes:

File NameSizeUsed By
favicon.ico16×16, 32×32, 48×48Older browsers, IE, bookmarks
favicon-16x16.png16×16Browser tabs
favicon-32x32.png32×32Retina tabs, bookmarks
apple-touch-icon.png180×180iOS home screen
android-chrome-192x192.png192×192Android Chrome
android-chrome-512x512.png512×512PWA splash screen

How to Create a Favicon in 3 Steps

  1. Upload your image

    Drag and drop any image (JPG, PNG, WebP, or SVG). Best results come from square images. Simple, bold designs work best at small sizes.

  2. Adjust options

    Customize the background (or keep it transparent), add padding, or apply rounded corners. Preview how it looks in a browser tab instantly.

  3. Download and install

    Click Download ZIP to get all sizes plus the HTML code. Upload the files to your site's root folder and paste the HTML into your <head> tag.

Key Features

All Sizes Included

Generate 16×16, 32×32, 180×180, 192×192, 512×512 PNG + ICO.

Ready-Made HTML

Copy-paste-ready link tags for your site's head section.

Live Preview

See how your favicon looks in a real browser tab simulation.

Rounded Corners

Apply a modern rounded look — perfect for app icons.

Custom Background

Choose a background color or keep it transparent.

100% Private

All processing in your browser — images never uploaded.

Best Practices for Favicons

Choose the right image

  • Use your logo or initials — something recognizable at 16×16
  • Keep it simple — detailed images become muddy at small sizes
  • High contrast — bold shapes and colors work best
  • Square aspect ratio — anything else will be cropped or padded
  • Text doesn't work well — only 1-2 letters max, if any

Installation steps

  1. Download the ZIP and extract it
  2. Upload all files to your website's root folder (or a /favicon/ folder)
  3. Copy the HTML code from the tool
  4. Paste it into the <head> section of every page
  5. Clear your browser cache and reload your site to see it

Cache Caching

  • Browsers aggressively cache favicons — you may need to clear cache or use incognito to see changes
  • Some browsers take 24-48 hours to update
  • Try visiting yourdomain.com/favicon.ico directly to force a refresh

Frequently Asked Questions

A favicon is the small icon that appears in browser tabs, bookmarks, and mobile home screens when someone visits your website. It's typically 16×16 to 512×512 pixels and helps with brand recognition.

At minimum: favicon.ico (16×16, 32×32, 48×48 multi-size), apple-touch-icon.png (180×180), favicon-32x32.png, favicon-16x16.png, plus android-chrome-192x192.png and android-chrome-512x512.png for Android and PWA. Our generator creates all of these automatically.

Use a simple, bold design — like your logo, initials, or a recognizable icon. Square images work best (1:1 aspect ratio). Avoid detailed images that become unrecognizable at 16×16 pixels. High contrast matters.

No. All favicon generation happens in your browser using the Canvas API. Your images never leave your device — complete privacy.

After downloading the ZIP, extract the files to your website's root folder and add the HTML link tags (provided by the tool) to the <head> section of your pages. Then clear your browser cache and reload your site.

Yes. The generated package includes:
  • apple-touch-icon.png — for iOS home screens
  • android-chrome-*.png — for Android and PWA
  • favicon.ico — for desktop browsers and bookmarks
  • PNG variants — for modern browsers

Yes. Image Size Reducer's favicon generator is completely free — no sign-up, no watermarks, no file limits. And it runs entirely in your browser.