Favicon Generator

Create favicon, Apple, Android, and PWA icon files from an image, with ready-to-paste HTML and manifest snippets.

Source image

Drop an image or choose a fileSVG, PNG, JPG, WebP · minimum 32 × 32px

Padding (%)

Corner radius (%)

Background

Theme color

Safari tint

Site name

Browser tab · light

My Website

Browser tab · dark

My Website

iOS home screen

My Website

Maskable safe area

HTML snippet

<link rel="icon" href="/favicon.ico" sizes="any">
<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="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="theme-color" content="#0f766e">
<meta name="msapplication-config" content="/browserconfig.xml">

site.webmanifest

{
  "name": "My Website",
  "short_name": "My Website",
  "icons": [
    {
      "src": "/android-chrome-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "/icon-192.png",
      "sizes": "192x192",
      "type": "image/png",
      "purpose": "maskable"
    },
    {
      "src": "/android-chrome-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    },
    {
      "src": "/icon-512.png",
      "sizes": "512x512",
      "type": "image/png",
      "purpose": "maskable"
    }
  ],
  "theme_color": "#0f766e",
  "background_color": "#ffffff",
  "display": "standalone"
}

Favicon and app icon generator

Create common browser, Apple, Android, and progressive web app icon sizes from one source image. The image is processed locally in your browser.

The ICO file contains 16, 32, and 48 pixel PNG entries. Maskable icon files use extra inset so launchers can crop the outside edge while keeping the central artwork visible. A 32 pixel minimum source size is required.

When to use it

Generate the package, add its files to your site's public directory, then paste the HTML snippet into the document head and keep site.webmanifest at the path used by the link.