Skip to content

Instantly share code, notes, and snippets.

@C-l-o-u-d

C-l-o-u-d/macos-app-icon.md

Forked from ansarizafar/macos-app-icon.md
Created May 4, 2024 07:03
Show Gist options
  • Save C-l-o-u-d/0e9a064ba017b9ae8e8da648a55fffea to your computer and use it in GitHub Desktop.
Save C-l-o-u-d/0e9a064ba017b9ae8e8da648a55fffea to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @jamieweavis jamieweavis revised this gist Jan 5, 2022. No changes.
  2. @jamieweavis jamieweavis revised this gist Aug 18, 2020. 1 changed file with 10 additions and 3 deletions.
    13 changes: 10 additions & 3 deletions macos-app-icon.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,5 +1,12 @@
    # How to create a `.icns` macOS app icon
    > How to make an app icon for macOS using `iconset` & `iconutil`
    # How to create an `.icns` macOS app icon

    > How to make an application icon for macOS using `iconset` & `iconutil`
    ## Steps

    - [Saving images](#saving-images)
    - [Creating an `.iconset`](#creating-an-iconset)
    - [Converting to `.icns`](#converting-to-icns)

    ## Saving images

    @@ -24,7 +31,7 @@ Save your app icon with the following names & dimensions:
    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 spacebar - A resizable preview of your icon should now appear.
    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`

  3. @jamieweavis jamieweavis revised this gist Apr 28, 2018. 1 changed file with 23 additions and 22 deletions.
    45 changes: 23 additions & 22 deletions macos-app-icon.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,32 +1,33 @@
    # How to create a `.icns` macOS app icon
    > How to make an app icon for macOS using iconset & iconutil
    > How to make an app icon for macOS using `iconset` & `iconutil`
    ## Saving images

    Save your app icon with the following names/dimentions:
    Save your app icon with the following names & dimensions:

    |Name|Dimentions|
    |---|---|
    |`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`|
    | 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 `.iconset`
    ## Creating an `.iconset`

    1. Move all of the images into a folder, rename the folder to: `icon.iconset`
    2. Add the file extension when prompted
    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 & images into an iconset, this can be verified by looking at the folder with quicklook (`spacebar`). Doing this should display a resizable icon preview.
    This will convert the folder of images into an iconset, this can be verified by quick looking with spacebar - A resizable preview of your icon should now appear.

    ## Convert to `.icns`
    ## Converting to `.icns`

    1. Navigate to the `.iconset` file in terminal
    2. Run `iconutil -c icns icon.iconset`
    3. A file named `icon.icns` will be created in the directory
    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
  4. Jamie Straw revised this gist Jul 13, 2017. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion macos-app-icon.md
    View file
    Original file line number Diff line number Diff line change
    @@ -10,7 +10,7 @@ Save your app icon with the following names/dimentions:
    |`icon_16x16.png`|`16x16`|
    |`[email protected]`|`32x32`|
    |`icon_32x32.png`|`32x32`|
    |`icon_32x32@x.png`|`64x64`|
    |`icon_32x32@2x.png`|`64x64`|
    |`icon_128x128.png`|`128x128`|
    |`[email protected]`|`256x256`|
    |`icon_256x256.png`|`256x256`|
  5. Jamie Straw created this gist Mar 19, 2017.
    32 changes: 32 additions & 0 deletions macos-app-icon.md
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,32 @@
    # How to create a `.icns` macOS app icon
    > How to make an app icon for macOS using iconset & iconutil
    ## Saving images

    Save your app icon with the following names/dimentions:

    |Name|Dimentions|
    |---|---|
    |`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 `.iconset`

    1. Move all of the images into a folder, rename the folder to: `icon.iconset`
    2. Add the file extension when prompted

    This will convert the folder & images into an iconset, this can be verified by looking at the folder with quicklook (`spacebar`). Doing this should display a resizable icon preview.

    ## Convert to `.icns`

    1. Navigate to the `.iconset` file in terminal
    2. Run `iconutil -c icns icon.iconset`
    3. A file named `icon.icns` will be created in the directory