6 files UK small businesses need for favicons in 2026

Publish 16×16 and 32×32 PNGs, a 180×180 Apple touch icon, 192×192 and 512×512 manifest PNGs, and a root /favicon.ico, with an SVG source if your mark scales cleanly at tiny sizes. One catch: detailed logos often turn to mush below 32 pixels, so simplify the artwork or lean on a PNG fallback rather than trusting one file to do every job. Export these now and wire up the link tags and manifest entries before you move on.

TL;DR:

Designing a master icon in SVG and exporting simplified PNGs at 16×16 and 32×32 ensures clarity across small sizes and prevents blurriness.

Including the 16×16, 32×32, 180×180, 192×192, and 512×512 PNG files plus a root ICO covers essential surfaces for browsers, search, and PWA functionality.

Using larger-than-48×48 images for Google Search results improves visibility, making 32×32 a better master source than 16×16.

A favicon should have a stable URL and be tested in real size on devices and browsers to ensure legibility and correct display.

Relying on a combination of PNG, SVG, and ICO formats offers compatibility, quality, and fallback support while avoiding design complexity.

BasicBS

basic-bs.co.uk

Launch a Clearer Website Faster

BasicBS builds high-performing websites for small businesses and events, with transparent pricing, managed hosting, SEO and ongoing updates.

Visit BasicBS

The recommended minimal favicon set for 2026
Formats: SVG, PNG and ICO, and when to use each
Manifest and PWA icons: sizes, purpose and the safe zone
Google Search eligibility and a practical crawlability checklist
A practical workflow: author, export, declare, test
Our take on favicons for small business and event sites
Getting your favicon sorted without the agency price tag
FAQ
Sources

The recommended minimal favicon set for 2026

Most sites overthink this. You don’t need twenty exported PNGs sitting in a folder, you need a handful of files that each do a specific job, and nothing more.

16×16 covers the classic browser tab and bookmarks bar, where every pixel counts and fine detail just disappears.
32×32 handles high-DPI tabs and taskbar pins, and doubles as a sensible working source for the 16×16 export.
48×48 is optional, mainly useful for Windows shortcuts and some browser suggestion menus.
180×180 is the Apple touch icon, used when someone adds your site to an iOS home screen.
192×192 and 512×512 are manifest sizes for Android and Progressive Web App install surfaces.
A root /favicon.ico keeps legacy browsers happy and acts as a multi-raster fallback when other icons are not available.

If you’re building fast, which is the whole point of a 5 to 7 working day turnaround, the 16×16, 32×32, 180×180, 192×192 and 512×512 PNGs plus the ICO are the non-negotiables. The 48×48 is nice to have, not essential, for the vast majority of small business or event sites.

Google’s own advice leans the same way: it recommends an image larger than 48×48px for favicons shown in Search results, because anything smaller tends to render poorly across the different surfaces Search uses. That’s a strong argument for treating 32×32 as your working master rather than squeezing everything out of a 16×16 file.

A practical shortcut: design one clean 32×32 icon, strip it back until it reads clearly at that size, then hand-tune the 16×16 separately rather than letting software shrink it automatically. Automatic downscaling is where most favicons go wrong, turning a crisp logo into a grey smudge nobody can identify.

Formats: SVG, PNG and ICO, and when to use each

Each format solves a different problem, and treating them as interchangeable is where a lot of favicon setups fall apart.

SVG scales to any resolution from a single file, which makes it brilliant for a master source, but fine detail (thin lines, small text, intricate shapes) collapses into noise once the rendered size drops below 20 or so pixels.
PNG gives you full control over exactly what appears at 16×16 or 32×32, because you’re hand-finishing a fixed-size raster rather than hoping a vector renders cleanly small.
ICO is a container format that can hold several raster sizes in one file (16×16, 32×32, 48×48 together), which is why it remains the standard for legacy Windows and Internet Explorer support.

The practical approach for most builds is a hybrid: design the master in SVG, then export simplified, hand-adjusted PNGs at 16×16 and 32×32 rather than trusting a raw export. MDN’s guidance on app icons is clear that browsers pick the most suitable image for the context, and recommends offering multiple versions so the right one shows up whether that’s a tab, a home screen, or an install prompt. Relying on a single SVG for every size skips that selection logic and risks a blurry or oversimplified result where it matters most.

When you build the ICO file, use a generator that lets you keep your hand-tuned 16×16 artwork rather than one that just auto-shrinks a large PNG into the container. The difference is obvious the moment you squint at a tab icon.

Pro Tip: Design the 16×16 version last, after you’ve already simplified the 32×32: it forces you to strip detail down to what the icon actually needs, rather than what looks nice at full size.

Manifest and PWA icons: sizes, purpose and the safe zone

Your web app manifest is a separate file from your favicon, and it needs its own set of rules.

Declare exact sizes and types. Each icon entry in manifest.json should list its pixel dimensions ("sizes": "192x192") and MIME type, because raster images need that precision for the browser to pick the right file; SVG entries can instead use "sizes": "any".
Set the purpose value. Use "purpose": "any" for a standard icon, "maskable" for one designed to fill an adaptive OS mask, or "monochrome" for single-colour contexts like notification badges.
Design maskable icons with a safe zone in mind. The W3C Web App Manifest specification defines the maskable safe zone as a central circle with a radius equal to 40% of the icon’s size, so for a 512×512 maskable icon that’s a 204.8px radius centred on the canvas. Anything important outside that circle risks being cropped by the device’s mask shape.
Offer format fallbacks where it matters. Listing the same size in both PNG and WebP lets a browser fall back gracefully if it doesn’t support one format.

None of this replaces your favicon.ico or your Apple touch icon. Manifest icons are for Android home screens and PWA install flows, and browsers choose whichever image fits the surface they’re rendering, which is exactly why a minimal spread of sizes beats a single oversized image stretched to fit everywhere.

Google Search eligibility and a practical crawlability checklist

Getting your favicon to actually show up in Search results comes down to a short list of technical rules, not design taste.

The image must be square and at least 8×8 pixels, though Google recommends well over 48×48 for anything to render clearly.
It needs a stable URL that doesn’t change often, because Google caches favicons and re-crawls them infrequently.
The file must be crawlable, meaning robots.txt and your Content-Security-Policy both allow Googlebot and Googlebot-Image to fetch it without redirects getting in the way.
You get one favicon per hostname, so keep it consistent across every page rather than swapping files per section.
Link it from your homepage using representative brand artwork, not a placeholder or a generic icon.

Google Search Central’s favicon guidance is explicit that meeting these technical requirements makes your favicon eligible for display, it doesn’t guarantee it’ll actually appear. Search surfaces change constantly, and Google reserves the right to show or hide the icon based on its own criteria. Treat the checklist as table stakes, not a promise.

A practical workflow: author, export, declare, test

Here’s the sequence that keeps favicon work from eating a whole afternoon on a tight build.

Author large, simplify small. Design your master artwork at a generous size, then deliberately strip detail for the 16×16 and 32×32 versions rather than relying on auto-resize.
Export the exact files. You need 16×16 PNG, 32×32 PNG, 180×180 PNG, 192×192 PNG, 512×512 PNG, and an ICO bundling 16/32/48.
Keep favicon.ico at a stable root URL. Moving it around or regenerating it constantly works against the caching behaviour Search relies on.
Add the HTML and manifest entries. A <link rel="icon"> with a sizes attribute for each raster file, an apple-touch-icon link for the 180×180, and a <link rel="manifest"> pointing at your manifest.json covers the bases.
Test at real size. Shrink your browser tab, check the icon on an actual phone home screen, and confirm the PWA install prompt shows a clean image rather than a stretched logo.

A W3C Working Draft from May 2026 sets out the maskable safe zone as a 40% radius circle, which is worth checking against your actual exported artwork rather than assuming your design fits.

A favicon generator tool like Premium Web Tools’ favicon generator can bundle the ICO and PNG sizes in one pass, and a service such as Cited is handy for confirming Googlebot can actually reach and crawl the file once it’s live.

Our take on favicons for small business and event sites

We’d rather ship a tight, legible favicon set than a folder of forty icon variants nobody checked at real size. When you’re building a plumber’s quote page or a wedding microsite in a working week, the win isn’t more files, it’s the right five files declared correctly and a stable URL that doesn’t move. Get a build that handles this properly through our services page.

— Rhys

Getting your favicon sorted without the agency price tag

We include favicon and manifest setup in every build we do, treating it as a basic requirement rather than an upsell. This fits our philosophy of pay monthly website design with clear pricing, no upfront cost, and fundamentals done properly the first time.

Whether you’re a sole trader after a simple website, an electrician who needs a mobile friendly quote page, or running a small business website build in Lancashire or anywhere else in the UK, here’s what comes as standard:

A site live in 5 to 7 working days, favicon and manifest included, no separate add-on fee.
Transparent web design pricing with no hidden charges and no long tie-in once your first 12 months are up.
Managed UK hosting, SSL, and monthly updates, all rolled into one plan rather than a dozen separate invoices.
AI search training and SEMrush-led SEO, so your business has a fighting chance of showing up in AI Overviews and ChatGPT search, not just traditional listings.

Our Website Sale! package starts from £10 a month, with no upfront cost and no punishing renewal bill waiting for you a year in. If you’d rather see why the cheapest option on paper often costs more down the line, our piece on why cheap website development fails is worth a read before you commit to anyone. Have a look at our portfolio and get in touch when you’re ready to go live.

FAQ

What is the ideal size for a favicon?

There isn’t a single ideal size, you need a small set: 16×16 and 32×32 for browser tabs, 180×180 for Apple devices, and 192×192 plus 512×512 for manifest and PWA use. Google recommends an image larger than 48×48px so it renders well across Search surfaces, which is why 32×32 makes a better working source than 16×16 alone.

Should the favicon be SVG or PNG?

Use SVG as your master file for crisp scaling, but export simplified PNGs for the smallest sizes, since fine detail tends to collapse once an SVG renders below about 20 pixels. MDN’s guidance on app icons backs a hybrid approach rather than relying on one format for every context.

How can I increase the size of my favicon?

Rather than stretching a small image up, which just produces a blurry result, redesign or re-export from your original artwork at the larger dimension you need. Work from a high-resolution master and export fresh 32×32, 180×180, 192×192 and 512×512 files individually rather than scaling one small icon upward.

Does the favicon need to be ICO?

No, modern browsers accept PNG and SVG favicons directly, but a root /favicon.ico is still worth keeping for legacy browser compatibility and as a reliable fallback. An ICO file can bundle multiple raster sizes (16×16, 32×32, 48×48) in one container, which is handy even if it’s not your primary icon format.

Sources

Define website favicon for Search results | Google Search Central
Define your app icons - Progressive web apps | MDN
Web App Manifest | W3C