BrandspireFree web resource hub

Brand essentials

Favicon Generator

Create a complete set of website icons from your logo.

FreeNo accountFiles stay on your device

Source image

#FFFFFF

Icon previews

Your website icons will appear here.

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

Keep small icons simple

A clear silhouette and strong contrast help a logo remain recognizable at 16 pixels. Inspect the smallest previews before publishing. A square source of at least 512 pixels gives the largest export more detail.

Choose the right framing

Contain preserves the whole image. Crop fills the square and trims the edges. Padding leaves space around the artwork; the background color also fills transparent areas in the original image.

Publish the icon set

Extract the bundle into your website public root. Add the supplied link elements to the page head, merging with existing icon declarations. The manifest references the included 192 and 512 pixel Android images. Set the manifest name and short_name to your site name before publishing. Browser icon caches can take time to refresh.