How to Use
- Select an image: Upload one logo image (PNG/JPG/WebP, etc.).
- Adjust appearance
- Background color: e.g.,
#ffffff(used behind transparent pixels). - Padding (%): 0–30% margin around the logo.
- Background color: e.g.,
- Generate: Click Generate to create all icon sizes. Download each PNG from its card.
- Copy tags: Use Copy tags to grab the
<link>snippet for your<head>.
Outputs / Results
- PNG icons at 16, 32, 48, 64, 180, 192, 512 px with names:
favicon-16x16.png,favicon-32x32.png,favicon-48x48.png,favicon-64x64.pngapple-touch-icon.png(180×180)android-chrome-192x192.png,android-chrome-512x512.png
- A ready-to-paste HTML
<head>snippet with<link>tags - Icons flattened against the chosen background color with the specified padding
[Completely Free] Utility Tools & Work Support Tools
You can use practical tools like CSV formatting, PDF conversion, and ZIP renaming entirely in your browser, all for free. Each tool page clearly explains “How to use it”, “What the output looks like”, and “Important notes & caveats”, so even first-time users can start without confusion.
Notes / Caveats
- File paths: The snippet uses site-root paths (
/...). If you store icons elsewhere, update the paths accordingly. - WordPress: Paste the
<link>tags into<head>via your theme’s head injection or a header code field. - Transparency: Transparent areas are filled with the chosen background color (no alpha in the output).
- Not included: This tool does not generate
favicon.ico, SVG, or maskable variants. Create those separately if required. - PWA: Android sizes (192/512) are included, but for maskable PWAs provide a dedicated asset and set
purpose="maskable". - Color validity: Use valid CSS colors like
#RRGGBB; invalid values won’t apply. - Browser limits: Very large source images may hit memory limits on low-end devices.
- Security: 100% client-side; no uploads occur.
