A small icon needs a simple shape

A detailed photograph or a long wordmark can disappear when reduced to a browser-tab icon. Start with a strong shape, enough internal contrast, and some space around the subject. The tool exports 16, 32, 48, 180, or 192 pixel square PNGs. Different destinations need different sizes; creating a PNG does not automatically install it on a website.

Contain and cover make different choices

Contain fits the complete source image inside the square and adds your selected background around it. Cover fills the whole square and crops the excess from the center. Compare both if the source is not square. The background is a solid color; the transparent option leaves empty areas transparent. Existing transparency in the source is composited onto the selected background when one is chosen.

Add the right link in your website

A common browser icon link uses rel="icon", type="image/png", and the path to the generated PNG. A touch icon can use rel="apple-touch-icon" with the 180 pixel version. Other platforms may have additional requirements, and this tool does not produce an ICO file, a web app manifest, or a complete set of platform assets. Keep the larger original for future exports and test the installed icon in a real browser.

Worked examples

Destination	PNG size	Starting point
Browser icon	32 × 32 px	A simple recognizable mark
Touch icon	180 × 180 px	A square source with clear edges

Good questions.

Does this create an .ico file?

No. The output is a PNG with the selected pixel dimensions.

Does the image become my site icon automatically?

No. Upload it to your website and add the appropriate icon link in your page head.

Why did the edges disappear in cover mode?

Cover crops the source from the center to fill the square. Use contain to keep the whole source.

Updated 5 November 2026 · Methods & corrections

Favicon PNG generator