How to create an .icns macOS app icon

macos-app-icon.md

How to create an .icns macOS app icon

How to make an application icon for macOS using iconset & iconutil

Steps

• Saving images
• Creating an .iconset
• Converting to .icns

Saving images

Save your app icon with the following names & dimensions:

Name	Dimensions
icon_16x16.png	16x16
[email protected]	32x32
icon_32x32.png	32x32
[email protected]	64x64
icon_128x128.png	128x128
[email protected]	256x256
icon_256x256.png	256x256
[email protected]	512x512
icon_512x512.png	512x512
[email protected]	1024x1024

Creating an .iconset

1. Move all of the images into a new folder
2. Rename the folder to: icon.iconset
3. Confirm the file extension when prompted

This will convert the folder of images into an iconset, this can be verified by quick looking with the spacebar - a resizable preview of your icon should now appear.

Converting to .icns

1. Navigate to the directory containing your icon.iconset in the terminal
2. Run iconutil with the following command: iconutil -c icns icon.iconset
3. Your icon.icns will be generated in the current directory

Keep in mind that if you're converting from something like SVG, then the 128x128@2x file and the 256x256 file won't necessarily be the same. The 128x128@2x and 128x128 files should look more or less the same, considering things like line thickness. But 256x256 can fit finer details on it, so the lines can be done thinner (relative to the size of the entire icon).

So while it's fair to say the size of the two is the same in dots, many of the replies above suggesting to use the same sips command to produce both should be looked at with a raised eyebrow.

What you actually want to do is render the SVG to a surface of the right WxH size, and at the right density. Then the @media queries in the SVG will behave correctly and can enable/disable parts of the image depending on the size.