Make your logo ready for browser tabs and Home Screens

FluffyBench’s Favicon and App Icon Generator turns one logo into browser-tab icons, a Home Screen image and a web-app icon set, with links ready for your website.

FluffyBench · 7 min read · Reviewed October 15, 2026

Which files does FluffyBench generate?

A favicon is the little picture beside your site’s name in a browser tab. The Apple touch icon is the picture used for an iPhone or iPad Home Screen shortcut. The larger app icons are listed in a manifest: a small text file that tells a web app where its icons live.

Think of the ICO as a small suitcase holding several icon sizes; the PNG favicons are those sizes handed over separately.

FluffyBench generates these files from your picture, including the manifest and HTML links. How we reviewed

This is a web-icon set. Native mobile-app resources and maskable icons—artwork designed to survive a platform’s shape crop—need a different setup.

Will your logo work as a tiny favicon?

A square picture at least 512 px across is a good starting point for the largest output. A smaller source is enlarged for that icon and may look soft.

A detailed drawing can become a blur at 16 px. Here’s the measured drawing and its favicon beside a separate, simpler mark.

Detailed source
Thin stems, flowers and printed details compete for space when this drawing shrinks.
Generated favicon
The enlargement exposes the gray clusters you see as a blur in a tab.
Separate simple mark
Broad shapes stay distinct. This is a different sample, not a cleaned-up version of the drawing.

Use a simpler symbol if the smallest saved favicon is hard to recognize. · Photo: Britton and Brown, Public domain, U.S. work published before January 1, 1931, via Wikimedia Commons.

FluffyBench resizes your picture; it doesn’t redraw fine details into a new logo. A symbol with a clear outline is easier to recognize than a full illustration or a wordmark with small lettering. If you can’t pick out your mark in the tab preview, the source artwork is the useful thing to change.

How does FluffyBench fit a tall or wide logo?

FluffyBench centers the whole picture inside a square without stretching or cropping it.

Illustration of square fitting. Checkerboard marks transparent space; an existing background inside your picture stays there.

Check the white background on your Apple touch icon

The saved 180 px Apple touch icon gets white in every transparent area, including holes inside the artwork.

Source and generated Apple touch icon, with the gaps filled as well as the surrounding space.

White artwork disappears against the Apple icon’s white fill. Use a source with enough contrast against white.

Illustration of the fixed White fill. Apple icon background has one choice: White.

Doing it in FluffyBench

Choose one picture and FluffyBench’s Favicon and App Icon Generator makes the complete set in your browser. There’s no separate Generate step.

Step 1. Choose your logo. FluffyBench generates the icon set automatically; keep your source picture for later changes.
1. Choose image opens your local file picker.
Step 2. Check How it looks: can you recognize the tiny tab icon and the Home Screen image against White?
1. Apple icon background is fixed at White.
2. Inspect the small browser-tab icon.
3. Inspect the Home Screen appearance.
Step 3. Download favicon-16x16.png to inspect the saved picture. Each row has its own Download button and file-size readout.
1. Read this output’s file size.
2. Download saves this PNG.

Add your FluffyBench icons to your website

Before copying files or links, check whether your site already has a web manifest. Keep its settings and its existing page link if it does.

Choose your path before unpacking the ZIP or changing your page’s head.

The ZIP gives you the files; Copy gives you the links your webpage needs. Follow your manifest path through this simple HTML website example.

The screenshots show FluffyBench; the folder and HTML are a website example. Uploading icon-links.html by itself won’t insert links in your page.

For a site builder or framework, the equivalent destinations are its public-files folder and page-head controls. FluffyBench doesn’t publish the files or edit your website for you.

Connect the app icons to your web manifest

The app-icon connection runs from your page to its manifest, then to the larger PNGs. For an existing site, use FluffyBench’s manifest Download to get the icon entries for that connection.

Existing site: merge the highlighted icon entries into your manifest. New site: use the generated site.webmanifest.

FluffyBench’s site.webmanifest contains the icon list, not an app name, start page or display preference. It’s a starting piece for your site’s manifest, not a complete installable-app setup.

What if FluffyBench refuses your image?

An ICO can hold several icon sizes. FluffyBench’s icon generator needs one picture to start from.

Illustration of a multi-size ICO and one extracted picture.

“Choose one image” means the file contains several pages, layers, texture images or icon sizes. For an ICO with multiple sizes, FluffyBench’s Image Extractor can pull out one picture for this generator.

Animated inputs use frame 1; the workspace warning explains what was left out. A static logo avoids choosing the wrong moment for your site’s icon.

Need to extract pages, images, surfaces or layers from a container?

Image extractor

How we reviewed

The botanical-image run produced these output sizes.

Setting	Output size in this run	Notes
favicon.ico · 16 px, 32 px, 48 px	15.1 KB	One ICO file with these included image sizes. Exact output: 15,086 bytes.
favicon-16x16.png · 16 × 16 px	488 B	Separate PNG favicon at the declared square size. Exact output: 488 bytes.
favicon-32x32.png · 32 × 32 px	1.4 KB	Separate PNG favicon at the declared square size. Exact output: 1,350 bytes.
favicon-48x48.png · 48 × 48 px	2.5 KB	Separate PNG favicon at the declared square size. Exact output: 2,502 bytes.
apple-touch-icon.png · 180 × 180 px	21.0 KB	The touch icon uses the selected white background in this capture. Exact output: 21,042 bytes.
android-chrome-192x192.png · 192 × 192 px	23.7 KB	Manifest icon marked purpose any. Exact output: 23,698 bytes.
android-chrome-512x512.png · 512 × 512 px	98.2 KB	Manifest icon marked purpose any. Exact output: 98,160 bytes.
site.webmanifest · 2 icon entries	284 B	Its top-level fields in this capture: icons. Exact output: 284 bytes.
icon-links.html · 6 link elements	483 B	Relative links for the favicon, touch icon, and manifest files. Exact output: 483 bytes.

Complete-file sizes for the reviewed input.

How we measured

Date: October 15, 2026. Browser: Chromium 153.0.8010.12. Device: Windows 32 logical processors.

Combined package; Apple touch background white; input 1,988 px by 2,667 px; one local image.

One live run produced 9 files totaling 163.1 KB (163,093 bytes). These are output sizes for this input, not a performance comparison.

PNG dimensions are pixels; file sizes use decimal KB for larger outputs and bytes for outputs below one kilobyte. Exact byte counts appear in the file table.

The generated manifest icons use purpose “any”.

The walkthroughs use the existing WebP rendering of the botanical illustration. The small-favicon and Apple-icon comparison panels use the measured outputs from the earlier SVG run; their byte counts are not the new walkthrough's readouts. Square-fitting and website-file diagrams are illustrations, not additional measurements. The white and green leaf panels illustrate the fixed White fill; they are diagrams, not additional measured outputs.

The source is fitted inside a 512 px square before output sizes are drawn. Source metadata is not copied into the icons.

The tool refused the original SVG because it contained a DOCTYPE or entity declaration. The successful run used a local copy with only its XML declaration and external DOCTYPE removed; the SVG path data was left unchanged. Its source page identifies the work as public domain in the United States, and copyright status can differ elsewhere.

The original staged input was 221.7 KB (221,666 bytes). The tool's SVG inspection reported 1,988 px by 2,667 px for the sanitized copy.

Image credits

Asclepias verticillata illustration — Britton and Brown. Public domain, U.S. work published before January 1, 1931. The staged SVG's XML declaration and external DOCTYPE were removed for safe local rasterization; its path data was retained, then resized and converted to WebP.

Favicon and app icon generator