Icon Composer

Icon Composer lets you create layered icons out of Liquid Glass from a single design for iPhone, iPad, Mac, and Apple Watch. With a new multi-layer icon format, you can easily adjust Liquid Glass properties, preview with dynamic lighting effects, and annotate across appearance modes. Icon Composer is designed to work seamlessly with Xcode, and also provides the option to export a flattened version of your icon for marketing and communication needs.

Multi-platform design made easy

New, rounder enclosure shapes and an updated grid system guide make designing across supported Apple platforms easier and more consistent. A single design is used by default and can be customized for each platform.

Design with Liquid Glass

Bring your icon to life with Liquid Glass—a new material featuring a range of expressive properties that respond to dynamic lighting and automatically scale with your icon. Import and organize your artwork layers, and adjust properties like specular highlights, blur, translucency, and shadows to create icons with new levels of depth and dimension.

Annotate across rendering modes

Icon Composer gives you full control over how your icon appears across rendering modes—all within a single file. Using a single layered structure, choose how your icon looks in Default, Dark, and Mono modes to optimize its appearance on iPhone, iPad, Mac, and Apple Watch.

Default theme preview showing the Icon Composer interface

Real-time previewing

See how Liquid Glass transforms your design, make quick adjustments, and compare your changes to the original. Preview how your icon responds to dynamic lighting across rendering modes and review it at various sizes on different backgrounds and wallpapers.

Built for Xcode

Once you’ve completed your annotations in Icon Composer, you can add the icon directly to Xcode. The new icon file type integrates seamlessly with Xcode, enabling you to sync changes directly into your project.

Download Icon Composer

Download

Requires macOS Sequoia or later.

Explore the Human Interface Guidelines

Get details on how to use SF Symbols in your apps.

Learn more