What is an ICNS file? An icon format used by macOS programs is called an ICNS file. It allows 1-bit and 8-bit alpha bands and saves one or more pictures, usually made from PNG documents. The program icon in the macOS browser and interface is displayed using ICNS files.
Import by default uses the "ImageList" element for ICNS files. Export accepts Image and Graphics of dimensions 512×512, 256×256, 128×128, 48×48, 32×32, and 16×16. An image or graphics object not at one of the standard dimensions will be scaled so that its longest dimension fits the closest standard dimension.
Here's a script to convert a 1024x1024 png (named "Icon1024.png") to the required icns file. Save it to a filed called "CreateICNS.src" in the folder where your png file is then in terminal "cd" to the same folder and type "source CreateICNS.src" to call it:
mkdir MyIcon.iconset
sips -z 16 16 Icon1024.png --out MyIcon.iconset/icon_16x16.png
sips -z 32 32 Icon1024.png --out MyIcon.iconset/[email protected]
sips -z 32 32 Icon1024.png --out MyIcon.iconset/icon_32x32.png
sips -z 64 64 Icon1024.png --out MyIcon.iconset/[email protected]
sips -z 128 128 Icon1024.png --out MyIcon.iconset/icon_128x128.png
sips -z 256 256 Icon1024.png --out MyIcon.iconset/[email protected]
sips -z 256 256 Icon1024.png --out MyIcon.iconset/icon_256x256.png
sips -z 512 512 Icon1024.png --out MyIcon.iconset/[email protected]
sips -z 512 512 Icon1024.png --out MyIcon.iconset/icon_512x512.png
cp Icon1024.png MyIcon.iconset/[email protected]
iconutil -c icns MyIcon.iconset
rm -R MyIcon.iconset
Checkout the following instructions (link):
Use iconutil to Create an icns File Manually
The
iconutil
command-line tool convertsiconset
folders to deployment-ready, high-resolution icns files. (You can find complete documentation for this tool by enteringman iconutil
in Terminal.) Using this tool also compresses the resultingicns
file, so there is no need for you to perform additional compression.To convert a set of icons to an icns file
Enter this command into the Terminal window:
iconutil -c icns <iconset filename>
where
<iconset filename>
is the path to the folder containing the set of icons you want to convert toicns
. The output is written to the same location as theiconset file
, unless you specify an output file as shown:
iconutil -c icns -o <icon filename> <iconset filename>
In other words, you need to replace <iconset filename>
by the path:
/Users/myname/SDK Mac Apps/MyApp/grafica/icon.iconset
Since the path contains spaces, you need to use double quotes, for example:
iconutil -c icns "/Users/myname/SDK Mac Apps/MyApp/grafica/icon.iconset"
This command should work properly.
While using all kinds of scripts to convert hi-res PNG
image to a pleiad of different low-resolution copies may seem handy (and it really is), one should not forget that this kind of automatic resizing will render perceptibly imperfect images.
I mean, I love imagemagick
too, but it is not the right tool for this task!
Instead, you should always request a logo in some vector format from your designer, for example in SVG
. With this on hand, you can manually prepare perfect PNG
files in all required resolutions and then make a single .icns
file, which will make your app icon look beautiful on every single screen, from a cheap iPhone SE to some high-end Retina display of the latest iMac. You can use Photoshop, GIMP or any other tool of your choice to generate these PNGs.
From the latest Apple's Human Interface Guidelines as of 2020, you should prepare the following PNG
files:
+---------------------+--------------------+--------------+
| filename | resolution, pixels | density, PPI |
+---------------------+--------------------+--------------+
| icon_16x16.png | 16x16 | 72 |
| [email protected] | 32x32 | 144 |
| icon_32x32.png | 32x32 | 72 |
| [email protected] | 64x64 | 144 |
| icon_128x128.png | 128x128 | 72 |
| [email protected] | 256x256 | 144 |
| icon_256x256.png | 256x256 | 72 |
| [email protected] | 512x512 | 144 |
| icon_512x512.png | 512x512 | 72 |
| [email protected] | 1024x1024 | 144 |
+---------------------+--------------------+--------------+
After all the PNG files are prepared, place them into some directory with .iconset
extension (Logos.iconset
for example) and execute the following from the Terminal
:
iconutil --convert icns Logos.iconset
If there were no errors after executing this command, then all the files were processed properly, and you got the Logos.icns
file in the same directory, containing all the beautiful crisp logos for your app which will suit any modern screen.
There's a command-line node module that does all the work of converting a PNG file into an iconset directory:
npm install -g node-icns
nicns --in adventure-cat.png --out adventure-cat.icns
These commands (entered in Terminal) worked for me to convert an old icns file to the new format:
cd Folder_With_Icns_File
iconutil -c iconset Your_Icon_Name.icns
rm Your_Icon_Name.icns
iconutil -c icns Your_Icon_Name.iconset
rm -R Your_Icon_Name.iconset
The -c
parameter to iconutil is no longer supported. Use --convert
instead:
cd Folder_With_Icns_File
iconutil --convert iconset Your_Icon_Name.icns
rm Your_Icon_Name.icns
iconutil --convert icns Your_Icon_Name.iconset
rm -R Your_Icon_Name.iconset
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With