Guides and Sample Code

Developer

macOS Human Interface Guidelines

iBooks

App Icon Gallery

A great app icon is not only gorgeous and inviting, it also conveys the main purpose of the app and hints at the user experience. As you decide how to best represent your app through its icon, it’s helpful to examine some successful icon designs.

User app icons are vivid and inviting, and should immediately convey the app’s purpose. For example, the Photo Booth icon communicates fun and clearly indicates that this app helps users take pictures of themselves.

image: ../Art/PhotoBooth_2x.png

In an app that primarily helps users create or view media, it makes sense for the icon to include the media. If appropriate, the icon can include a tool to communicate the type of task that the app helps the user accomplish. The Preview icon shown here uses a magnification tool to convey that the app can be used to view pictures. The proximity of the magnifier to the pictures makes it clear that the tool’s function is directly related to the content the app handles.

image: ../Art/Preview_2x.png

Some apps that represent objects or well-known products, such as Dashboard and QuickTime Player, are most easily recognized by enhanced versions of the symbols or objects themselves.

image: ../Art/DashboardApp_2x.png
image: ../Art/QuickTimePlayerX_2x.png

Icons for utility apps tend to convey a more serious tone than those for user apps. Color in utility app icons is desaturated, predominantly gray, and added only when necessary to clearly communicate what the apps do. For example, notice the prevalence of gray and the discriminating use of color in the Activity Monitor and Keychain icons shown here:

image: ../Art/ActivityMonitor_2x.png
image: ../Art/KeychainAccess_2x.png