How to make icons for a Mac app

A Mac app's icon is stored as an .icns file, Apple's own icon format. The Mac and Linux version of ICON by Zaweba outputs .icns files, so you load your picture once and save an .icns ready to go into your app. The same version also makes Linux icon sets, and it has the same engine as the Windows app for .ico files and website favicons.

If you build software for more than one system, that saves juggling three different tools for three different icon formats.

Before you start

Start with a square picture, as large as you have. The app's general advice is 512 pixels or more, so the small sizes stay sharp, and a big icon on a Mac is shown large in places like the Dock and Finder, so detail counts. A PNG with a transparent background gives you the cleanest edges.

ICON for Mac and Linux runs on macOS 12 or later, on Apple silicon and Intel, and on 64-bit Linux, on x86 and ARM. It works offline, with no account.

Saving an .icns file

Open ICON and load your picture. The preview shows it on a checkerboard so you can see where it is transparent. If the picture is not square, pick a fit: Contain keeps the whole image and pads with transparency, and Cover fills the square and crops the centre.

Then choose the .icns output and save it. That file is what a Mac app uses for its icon. How you attach it depends on how you build your app; most build tools take an .icns path and put it in the right place inside the app bundle.

If the same program also runs on Windows, save a multi-size .ico from the same picture while it is loaded. The Windows .ico ICON makes holds sizes from 16 to 256 pixels, each a high-quality downscale, with the 256 size stored as PNG as modern Windows expects. For Linux, save the Linux icon set too. One picture, one session, matching icons on all three systems.

Making it look right on a Mac

Mac icons are seen big more often than Windows icons are, so a soft or upscaled source shows. Use the original artwork rather than a screenshot of it. If you only have a small logo, it may be worth redrawing it as vector art in Vectornation by Zaweba first and exporting a large PNG.

Leave a little breathing room. An icon that runs right to the edge of the square can look cramped among others. If you want a margin, add it to the picture before loading, or use Contain on a picture that already has some space round it.

Keep the small sizes in mind as well. Finder lists and menus show icons tiny, where fine text and thin lines vanish. A bold, simple symbol works better there than a detailed scene.

Windows programs from a Mac

The Mac and Linux version also has a managed program-icon editor for Windows programs. That suits developers who build Windows software on a Mac or Linux machine and want to put an icon into a Windows program they made, without switching computers. As on Windows, keep a copy of the original program until you have checked the result, and remember that changing the icon changes the file, so a signed program needs signing again.

Other things ICON does

While your picture is loaded, ICON can also build the complete website favicon set: favicon.ico, the PNG sizes, the Apple touch icon at 180 pixels, the Android icons at 192 and 512, the Windows tile, site.webmanifest, browserconfig.xml and the head tags to paste. So the app, its website and its Windows build can all share the same icon, made in one place by ICON by Zaweba.