Brandize LogoBrandize

Free favicon generator

Create a favicon for free
from any image

Upload your logo or any image and download a complete favicon set. ICO, PNG, Apple Touch Icon, Android Chrome, all in one ZIP.

Upload an image

Drop your image here or click to upload

PNG, JPG, SVG, or WebP (max 5MB)

How it works

Upload your image

PNG, JPG, SVG, or WebP. Square works best but any aspect ratio is fine.

Preview your favicons

See how your image looks at each size, from the 16px browser tab to the 512px Android splash.

Download everything

One ZIP with all six PNG sizes, an ICO for older browsers, a site.webmanifest, and the HTML to paste into your site.

What you get

favicon.ico

Legacy browsers

16x16 + 32x32

favicon-16x16.png

Browser tabs

16x16

favicon-32x32.png

Taskbar, tabs

32x32

apple-touch-icon.png

iOS home screen

180x180

android-chrome-192x192.png

Android home screen

192x192

android-chrome-512x512.png

Android splash screen

512x512

site.webmanifest

PWA manifest

How to add a favicon to your website

Drop all the files into your site's root directory and add the HTML snippet to your page's head tag. Two minutes, tops.

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">

Next.js

// app/layout.tsx
import type { Metadata } from 'next'

export const metadata: Metadata = {
  icons: {
    icon: [
      { url: '/favicon-16x16.png', sizes: '16x16', type: 'image/png' },
      { url: '/favicon-32x32.png', sizes: '32x32', type: 'image/png' },
    ],
    apple: [{ url: '/apple-touch-icon.png', sizes: '180x180' }],
  },
  manifest: '/site.webmanifest',
}

WordPress

// In WordPress, go to Appearance → Customize → Site Identity
// and upload your favicon-512x512.png as the "Site Icon".
//
// Or add this to your theme's functions.php:
function custom_favicon() {
  echo '<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">';
  echo '<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">';
  echo '<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">';
  echo '<link rel="manifest" href="/site.webmanifest">';
}
add_action('wp_head', 'custom_favicon');

Frequently asked questions

Need a logo first?

Make one in about 30 seconds, then come back and turn it into a favicon.

Try Brandize