A favicon is one of the smallest elements on your website but one of the most visible. It appears in browser tabs, bookmarks, Google search results, and on mobile home screens when users save your site. Despite being just 16 to 512 pixels wide, a good favicon communicates professionalism and brand identity instantly. Creating the right favicon — in all the sizes you need — has never been easier.
Rekreay's free Favicon Generator lets you upload any image and generate professional favicon icons in every standard size, all within your browser. No software installation. No server upload. No cost.
How the Tool Works
The Rekreay Favicon Generator uses the HTML5 Canvas API to resize your source image to each selected favicon dimension with high-quality bicubic scaling. Here is the complete process:
- Upload your image. Drag and drop any JPG, PNG, WebP, GIF, or SVG file onto the upload zone. Your image loads instantly in the browser — it never leaves your device.
- Select your sizes. Choose from nine standard sizes: 16×16, 32×32, 48×48, 64×64, 128×128, 180×180, 192×192, 256×256, and 512×512 pixels. The most important for full coverage are 32×32 (browser tabs), 180×180 (Apple Touch Icon), 192×192 (Android/PWA), and 512×512 (Google PWA requirements).
- Generate. Click "Generate Favicons" and all selected sizes appear instantly as preview cards.
- Download. Each card has a download button. Click to save that size as a PNG file named with its dimensions (e.g., favicon-32x32.png).
Which Favicon Sizes Do You Need?
The sizes you need depend on which platforms you want to support:
- 16×16 px — legacy browser tab support (Internet Explorer, very old browsers)
- 32×32 px — the primary browser tab favicon for Chrome, Firefox, Safari, and Edge
- 48×48 px — Windows taskbar and Windows desktop shortcuts
- 64×64 px — Windows site icons and some browser address bars
- 180×180 px — Apple Touch Icon for iPhone and iPad (the icon used when users add your site to their home screen)
- 192×192 px — Android Chrome, Google's recommended icon size for PWAs
- 512×512 px — Google's required icon size for PWA splash screens
For a Blogger website, uploading the 32×32 PNG to Blogger's favicon setting covers browser tabs. Adding a 180×180 PNG as an Apple Touch Icon covers iOS home screens. For a full professional setup, generate all seven sizes listed above.
Tips for the Best Favicon Results
Start with a Square Source Image
Favicons are square. If your source image is not square, the generator will resize it to fit a square canvas, which may crop or distort the content. Crop your source image to a square (1:1 aspect ratio) before uploading for the best results.
Use a High-Resolution Source
Your source image should be at least 512×512 pixels. This ensures the largest favicon size (512×512 for PWAs) is generated at full resolution without upscaling. Smaller sources will still work for smaller sizes but may appear slightly soft at the largest dimensions.
Use PNG with Transparency
If your logo has a transparent background, save your source as a PNG with an alpha channel. The favicon generator preserves transparency, allowing your favicon to blend correctly against both light and dark browser themes.
Keep it Simple
At 16 pixels, complex images become unrecognisable. Test your favicon at actual 16×16 size before finalising. Single letters, simple geometric shapes, or the most distinctive element of your logo work best.
How to Add Your Favicon to Blogger
- Download the 32×32 PNG from the generator.
- In Blogger, go to Settings → Basic.
- Scroll to Favicon and click "Choose File."
- Upload the 32×32 PNG and save settings.
- To add Apple Touch Icon and Android icon support, edit your theme HTML and add link tags inside the
<head>section.
How to Add Your Favicon to WordPress
- Download the 512×512 PNG from the generator (WordPress will downscale from this).
- Go to Appearance → Customize → Site Identity → Site Icon.
- Upload the 512×512 PNG and WordPress automatically generates all required sizes.
- Save and publish.
Frequently Asked Questions
Does the tool generate ICO files?
The generator produces PNG files, which are the modern standard. All current browsers support PNG favicons natively. If you specifically need a legacy .ico file for very old browser support, you can convert the generated 16×16 and 32×32 PNGs to ICO format using a separate online ICO converter.
Is there a watermark on the generated favicons?
No. The Rekreay Favicon Generator is completely free with no watermarks, no registration, and no usage limits. Generated favicons are yours to use for personal or commercial projects.
Are my images uploaded to a server?
No. All processing happens locally in your browser using the HTML5 Canvas API. Your image never leaves your device. There is no server upload, no data collection, and no privacy exposure.
Final Thoughts
A professional favicon is a five-minute investment that makes your website look complete and trustworthy. Use Rekreay's free Favicon Generator to create all the sizes you need from any image, directly in your browser. No software, no cost, no compromise on quality.
Once your favicon is set up, consider also adding a QR code to your offline marketing materials to direct people to your site, and ensure all your blog images are optimised with Rekreay's Image Compressor for the best page speed performance.