Screenshots show the English app. Preset names and controls are also available in your app language.

Your starting point

Use Favicon Set in PixRinse, then review these settings against your actual destination.

Settings for this workflow
Favicon PNGs16 / 32 / 48 px
Apple Touch PNG180 px
Web-app PNGs192 / 512 px
ColorsRGB
PixRinse Favicon Set preset with six PNG website icon sizes
Settings used for this walkthrough. Select the screenshot to inspect it at full size.
PNG format and Convert to sRGB are shown in the encoding controls.
PNG format and Convert to sRGB are shown in the encoding controls.

How to do it

  1. Prepare a square source mark

    Use a source at least as large as the largest icon you need. Simplify fine details that may disappear at 16 px.

  2. Choose Favicon Set

    Review the six sizes. The template uses a centred cover rule, so a non-square source may be cropped.

  3. Inspect the smallest outputs

    Check the 16 and 32 px files at actual size. Automatic resizing cannot replace deliberate optical adjustments for a complex brand mark.

  4. Export and add your references

    Add the PNG files to your website and reference the relevant sizes in the HTML head and web-app manifest.

THE FILES FROM THIS WALKTHROUGH

What this example produced

A 1024 × 1024 square mark produces six PNGs without the non-square-source warning. Every exported file contains an sRGB profile.

Square source
1024 × 1024
PNG exports
6
Color profile
sRGB on every output
Actual exported files
FileFormatPixelsBytes
android-chrome-192x192.pngPNG192 × 19226,980
android-chrome-512x512.pngPNG512 × 512174,868
apple-touch-icon.pngPNG180 × 18023,839
favicon-16x16.pngPNG16 × 16692
favicon-32x32.pngPNG32 × 321,751
favicon-48x48.pngPNG48 × 483,093
Make a set of website icons: actual exported results
Actual export results for the sample files shown in this walkthrough.

Measured on the sample files shown. Your results depend on your originals and settings. This walkthrough uses owned PixRinse artwork on square or transparent sample canvases.

A couple of common questions

Does it create favicon.ico?

No. The built-in set exports six named PNG files.

Will a wide logo work?

A square source is preferable. The cover rule can crop a wide source, so review the preview carefully.

Put the workflow to work.

Open PixRinse, add a few images and start with the settings above.

Download for MacFree: up to 10 images per batch and one output per source. This workflow’s multiple outputs require Pro. Compare Free & Pro.