Favicon Builder
Generate the full favicon and PWA package from text, emoji, or uploaded images. Exports ICO, 14 PNG sizes, SVG, Web App Manifest, HTML snippet, and a Next.js App Router bundle.
Scale the text before it is fitted into the favicon safe area.
Favicon Builder generates the full favicon and PWA package — ICO, PNG (14 sizes), SVG, Web App Manifest, HTML snippet, and a Next.js App Router bundle — from text, emoji, or an uploaded image. Everything renders locally on Canvas; no upload, no signup.
Most favicon generators ship one ICO file and call it done. Modern websites need a stack: ICO for browser tabs, multiple PNGs for retina, SVG for crisp scaling, an apple-touch-icon, a Web App Manifest with theme/background colors, and matching <link> tags. This builder produces all of them at once and adds a Next.js App Router bundle that drops into the conventional app/ file paths.
No. Uploaded images are loaded via FileReader and rendered to a local Canvas. Nothing is sent to a server.
PNG: 16, 32, 48, 64, 96, 128, 144, 152, 167, 180, 192, 256, 384, 512 px. ICO: 16, 32, 48 px combined into one .ico file. SVG is included when the source is text or emoji-only (vector-friendly).
A copy-paste ready setup for the Next.js 13+ App Router: app/icon.tsx (dynamic ImageResponse), app/apple-icon.tsx, app/manifest.ts (typed manifest), and a metadata snippet that wires the favicon, apple-touch-icon, and manifest URLs through generateMetadata.
Detail loss is normal at 16px and 32px. Use bold contrast, simple shapes, large letter forms, and avoid thin strokes. The padding slider trims content to keep the icon legible at favicon scale.
Yes. Open Advanced Options to set app name, short name, and theme color. Those values flow into the Web App Manifest export and the Next.js manifest.ts file.
No. This is a separate, independent tool that runs alongside the existing /favicon-generator. Use whichever fits your workflow.