Icon Workshop
A smaller
brighter web.

One image. Every screen.

Favicon & app icon generator

Small icons. A lasting impression.

Convert your image into website favicons, app icons and a ready-to-use icon pack.

PNG ICO PWA

Create your icon pack

Turn your image into favicons, app icons and more.

  1. 1Upload
  2. 2Adjust
  3. 3Download
Waiting for an image
Drop your image here

PNG, JPG or SVG · Up to 5 MB

Your image is processed in your browser. It never leaves your device.

16 × 16
32 × 32
48 × 48
180 × 180
192 × 192
512 × 512

Adjust your icon

Fine-tune the look for every screen.

6%
0%

See it in context(upload to preview your icon)

Browser tab

×
https://example.com

iOS home screen

Your icon here

PWA / Android

Your icon here

How to make a favicon in 3 steps

From one image to a complete set of icons.

1Upload your image

Start with a clear logo or simple mark. A square image works best.

2Adjust and preview

Choose the fit, background and padding. Check the result at small sizes.

3Download and add to your site

Export your icon pack, upload the files, and add the icon links to your HTML.

One logo, ready for every screen

See where the generated files are used.

Website favicon

My Site×
16 × 16 website favicon example16 × 16
32 × 32 browser tab icon example32 × 32

16 × 16 and 32 × 32 icons help visitors recognize your site in tabs and bookmarks.

iPhone & iPad

My Site
iPhone & iPad · 180 × 180180 × 180

Use a 180 × 180 apple-touch icon when your site is added to the home screen.

PWA & Android

Install app
PWA & Android · 192 × 192192 × 192
PWA & Android · 512 × 512512 × 512

192 × 192 and 512 × 512 images are common sizes used by web app manifests.

What’s in your icon pack?

A ready-to-use set of icons for all platforms.

  • favicon.ico16 × 16, 32 × 32, 48 × 48, 256 × 256
  • apple-touch-icon.png180 × 180
  • icon-192.png192 × 192
  • icon-512.png512 × 512
  • site.webmanifestWeb app manifest

Add icons to your website

Place these links in your HTML <head>.

<link rel="icon" type="image/x-icon" href="/favicon.ico">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

Frequently asked questions

What is a favicon?

A small image that represents your website in browser tabs and bookmarks.

Which image format should I use?

PNG is a good choice for transparent logos. JPG, WebP and safe SVG can also be used.

Can I use a non-square image?

Yes. Choose Fit, Crop or Stretch to create a square icon.

Why are several icon sizes included?

Browsers and home screens use different sizes. Smaller icons stay clear in tabs; larger icons suit app shortcuts.