Favicon generator.

Turn a PNG or SVG into a complete, real-world favicon set — .ico, Apple touch, maskable, web manifest, and the exact markup to paste.

Runs in your browser
Nothing is uploaded
Free — no sign-up

Source image

Click to upload or drag and drop

image/png,image/svg+xml,image/jpeg,image/webp

PNG, SVG, JPG, or WebP. A square image of at least 512×512 looks best. Everything is processed in your browser — the file never leaves your device.

Look

Transparent background

Off lets you set a solid fill behind the icon. Apple touch and maskable icons are always given a solid background.

Padding0%

Corner radius0%

Manifest & app

App name

Short name

Home-screen label.

Theme color

Browser UI tint.

Splash background

PWA launch screen.

Upload an image to beginLive previews, the full icon package, and copy-paste markup appear here.

Good to know.

A favicon generator turns one image into the icon files browsers and phones need — a multi-size favicon.ico, Apple touch icon, PWA icons, and a web manifest. This one is free, runs entirely in your browser, and gives you the exact HTML to paste.

What's in the package

From one image we render the full real-world set: a multi-resolution favicon.ico (16/32/48), standalone PNGs, an apple-touch-icon, 192 and 512 PWA icons, a maskable icon for Android, and a site.webmanifest — plus the exact markup to paste.

Everything stays on your device

Your image is processed entirely in your browser with the Canvas API. Nothing is uploaded, so there is no queue, no watermark, and no privacy trade-off — the reason most online generators feel slow and sketchy.

How to make a favicon

Upload an image. Drop in a square PNG or SVG, ideally at least 512×512.
Adjust the look. Set the background, padding, corner radius, theme color, and app name.
Download the package. Download the full favicon set, including the .ico, PNGs, and manifest, as a zip.
Add it to your site. Paste the generated HTML — or use the Next.js App Router files — into your project.

Frequently asked

What size should my source image be?

A square PNG or SVG of at least 512×512 looks best — it scales down cleanly to every icon size. SVG is ideal because it is resolution-independent.

Where do I put the files?

Drop them in your site's root directory and paste the generated <link> tags into your <head>. If you use Next.js, the App Router export shows the file-convention names to use instead.

What is a maskable icon?

Android masks app icons into circles, squircles, and other shapes. A maskable icon adds padding (a "safe zone") and a solid background so it looks right whatever shape the device applies.

Builder

Your whole site, not just its favicon.

A favicon is the first pixel of your brand. sparx Builder runs the rest — themes, pages, a custom domain, and automatic SSL — and ships a real header, manifest, and SEO out of the box. Live in five minutes.

Explore Builder

What you get with sparx Builder.

The website module. Pick a theme, edit blocks in the browser, point your domain. SSL and the global CDN are handled for you. The same builder serves a one-page portfolio, a 40-post blog, or a 50,000-SKU catalog.

Theme-first.

Start from a polished theme, change the parts that matter, publish. Want full control? Build a custom frontend against the same API — coding optional, never required.

Block editor.

Drag, drop, edit in the browser. Every block is responsive and accessible by default — clean markup, no mystery wrappers, no shadow DOM.

Custom domain + SSL.

Point your DNS and your certificate provisions itself. No separate DNS service, no certificate to renew, no upcharge.

Builder is one module on the sparx platform — activate it alongside storefront, CRM, CMS, email, and B2B on one data layer and one bill. Only pay for what you run.

Explore the platform See pricing

More free tools.

Every sparx tool runs entirely in your browser — free, no account, nothing uploaded.