SF Symbol Changes in iOS 15

Introduction

In WWDC 2021: What’s New in SF Symbols, Apple announced SF Symbols 3. There are approximately 660 new symbols, multicolor symbols now work correctly in UIKit, and there are two new rendering modes with enhanced color customisation: hierarchical and palette.

There are now five different sets of symbols to consider:

  • SF Symbols v1.1 available in iOS/iPadOS/tvOS/Mac Catalyst 13.0, watchOS 6.0 and macOS 11.0

An app can only use symbol names that are supported by the OS version it is running on. Symbols that were renamed are still available using their earlier names for backwards compatibility. However, Jiang Jiang (who appears to work at Apple) mentioned on Twitter that:

It is worth noticing that while aliased (old) names continue to work it is definitely better to migrate to the up-to-date names for performance reasons.

The minimum iOS deployment version of your app will determine which symbols you can use and whether you must keep using the older names (or use runtime availability checks to use the new names on later versions).

For a detailed list of symbols that were added or renamed in SF Symbols 2, please refer to my earlier article SF Symbols Changes in iOS 14. For changes in iOS 14.2, see SF Symbols Changes in iOS 14.2. For changes in iOS 14.5, see SF Symbols Changes in iOS 14.5.

The purpose of this article is to describe what has changed in SF Symbols in iOS 15, not how to write code to use the new features. The “Resources” section towards the end of this article has links to some WWDC videos and blog posts which explain how to use the new features.

SF Symbol Browsing Apps

Apple have updated their SF Symbols Mac app to support the new symbols and rendering modes in iOS 15:

Apple’s SF Symbols Mac app v3.0 (build 56)

At the time of writing, version 3.0 is in beta and the latest build (56) includes the symbols as of iOS 15 beta 2. It does not include the symbol changes from beta 4. For more information about the app, see WWDC 2021: Explore the SF Symbols 3 app. Note that Apple never released v2.2 and so the symbols added in iOS 14.5 were not included until now.

A number of iOS apps are available on the App Store for browsing SF Symbols. Unfortunately, some of them have not kept up to date with all the additions, renames and changed categorisation of symbols over time.

My own Adaptivity app is a tool for iOS developers and designers, and one of its many features is a comprehensive view to browse SF Symbols. I take great pride and invest a lot of time and effort in keeping it up to date. It does include changes the symbol changes in beta 4. The iPhone and iPad screenshots in this article were taken from a pre-release version of Adaptivity v8.0 in order to demonstrate the symbol changes in iOS 15 and new rendering modes. The current App Store version will show iOS 15 symbols when run on the beta, but cannot show the new rendering modes.

Changes in SF Symbols 3

At the time of writing, iOS 15 is still in beta. If history repeats itself, there are likely to be more renames and new symbols added during the beta cycle. I will keep this article, and Adaptivity, up to date with the changes as they happen.

There are far too many changes to list them all in detail. The changes fall into several different categories:

  • New symbols Over 660 new symbols have been added; some have restricted usage

New Symbols

There are 793 symbols in the ‘What’s New’ category on iOS 15 but some of them are renamed versions of existing symbols (see below for more information).

The difference in the symbol count in the ‘All’ category between iOS 14.5 and iOS 15 suggests a total of 3,283 − 2,622 = 661 new symbols. However, a few are variants of existing symbols with support for right-to-left localization (e.g. using leading and trailing instead of left and right), so the number of truly new symbols is slightly lower.

iOS 15 System Images ‘What’s New’ category in Adaptivity v8.0 on 12.9" iPad Pro
iOS 15 System Images ‘What’s New’ category in Adaptivity v8.0 on 12.9" iPad Pro

Adaptivity’s ‘Availability’ annotation (selected from the Info icon in the bottom right) adds a small 15+ annotation to symbols which are new in iOS 15. To make it easier to see which symbols are not supported in iOS 13, there is no annotation shown for symbols that were available in iOS 13 (unless they were renamed since; see below for more information).

A red ⓘ button indicates a symbol is restricted. Tapping the button shows an alert explaining how the symbol can be used. Adaptivity also has a custom ‘Restricted’ collection which shows just the restricted symbols. The number of restricted symbols has increased from 151 in iOS 14.5 to 257 in iOS 15:

iOS 15 System Images ‘Restricted’ collection in Adaptivity v8.0 on 12.9" iPad Pro
iOS 15 System Images ‘Restricted’ collection in Adaptivity v8.0 on 12.9" iPad Pro

Renamed Symbols

Over 130 symbols have been renamed in iOS 15. For apps that support earlier iOS versions, the older names must be used. When running on iOS 15, either name can be used.

As in the past, there appears to be several different reasons for renames:

  • Naming E.g. a number of names containing fill have become filled

When the right sidebar is enabled, Apple’s SF Symbols Mac app shows availability information and, if applicable, the deprecated name for the selected symbol.

Adaptivity makes it easy to see renamed symbols. When the ‘Availability’ annotation is enabled, a list of iOS versions is shown for symbols that have been renamed since they were first added. For example, a 15+,14 annotation indicates that a symbol was added in iOS 14 but has been renamed in iOS 15. Some symbols have been renamed multiple times, e.g. star.leadinghalf.filled shows a 15+,14,13 annotation to indicate it was available in iOS 13, renamed in iOS 14 and renamed again in iOS 15.

Adaptivity also has a custom ‘Renamed’ collection which shows all the symbols that have been renamed in the data set you are viewing:

iOS 15 System Images ‘Renamed’ collection in Adaptivity v8.0 on 12.9" iPad Pro
iOS 15 System Images ‘Renamed’ collection in Adaptivity v8.0 on 12.9" iPad Pro

A long press on a symbol shows a larger image in a context menu preview, along with the symbol name, availability, any deprecated names, and supported rendering modes. You can quickly copy the name to the clipboard (and, thanks to Universal Clipboard, this will be available for pasting into your code on another device). For symbols that have been renamed, choose which version to copy. The List view also shows the availability information and any deprecated names in each table cell:

iOS 15 System Images ‘Renamed’ collection, context menu and List view in Adaptivity v8.0 on iPhone 12 Pro
iOS 15 System Images ‘Renamed’ collection, context menu and List view in Adaptivity v8.0 on iPhone 12 Pro

Multicolor Symbols

SF Symbols added support for multicolor in iOS 14. Unfortunately, these did not render correctly at most weights, scales and content size categories in UIKit. I think SwiftUI and AppKit did render them correctly. Mac Catalyst apps are effectively UIKit, so they exhibited the same issues. In iOS 15, all multicolor symbols now render correctly in UIKit.

There are 869 symbols in the ‘Multicolor’ category, an addition of 706 to iOS 14.5’s 163 symbols. Most of these are existing symbols rather than symbols that have been added in iOS 15.

iOS 15 System Images ‘Multicolor’ category and render mode in Adaptivity v8.0 on 12.9" iPad Pro
iOS 15 System Images ‘Multicolor’ category and render mode in Adaptivity v8.0 on 12.9" iPad Pro

Adaptivity’s ‘Render Mode’ setting (selected from the Info icon in the bottom right) allows multicolor rendering to be selected. Multicolor symbols fall into several categories:

  • all fixed colors (e.g. cloud.sun.rain.fill).

The tint color is configurable in Adaptivity. It defaults to systemMint as that doesn’t seem to be used as a fixed color in any symbols, making it slightly easier to see which parts of a symbol are tinted and which are a fixed color.

When multicolor rendering is selected, symbols that don’t support multicolor will be shown in monochrome and tinted with this color. A gray background is shown behind each image to make it easier to distinguish between fixed white and transparent parts of the image. This is even clearer in dark mode.

iOS 15 System Images display options and ‘Multicolor’ category and rendering mode in Adaptivity v8.0 on iPhone 12 Pro
iOS 15 System Images display options and ‘Multicolor’ category and rendering mode in Adaptivity v8.0 on iPhone 12 Pro

Hierarchical and Palette Symbols

Two new rendering modes were added in iOS 15: hierarchical and palette. Adaptivity has a ‘Hierarchical / Palette’ category which shows the 2,259 symbols that support these rendering modes. Every symbol which supports one of these modes also supports the other: they always occur together.

Symbols supporting these rendering modes contain two or three layers. In hierarchical rendering, a single base color is used for the primary layer. Secondary and tertiary layers (where applicable) use different opacities of that base color. The base color is configurable in Adaptivity.

iOS 15 System Images ‘Hierarchical / Palette’ category and hierarchical render mode in Adaptivity v8.0 on 12.9" iPad Pro
iOS 15 System Images ‘Hierarchical / Palette’ category and hierarchical render mode in Adaptivity v8.0 on 12.9" iPad Pro

In palette rendering, the colors for each layer can be configured separately:

iOS 15 System Images ‘Hierarchical / Palette’ category and palette render mode in Adaptivity v8.0 on 12.9" iPad Pro
iOS 15 System Images ‘Hierarchical / Palette’ category and palette render mode in Adaptivity v8.0 on 12.9" iPad Pro

Localized Variants

Some symbols appear partially or fully horizontally-flipped in right-to-left localizations. Symbols that contain letters (e.g. textformat.size) show non-English characters in place of the “A”. Some symbols (e.g. thegoforward.5 etc. series of symbols) show the numerals in Arabic or Hindi.

When the right sidebar is enabled, Apple’s SF Symbols Mac app shows localization information for the selected symbol.

Adaptivity does not currently identify symbols with localized characters or numbers, but it does have an optional left-to-right annotation (⇄) to identify symbols that have right-to-left localizations. Adaptivity also has a custom ‘Right-to-Left’ collection to make them easy to find. iOS 15 increases the number of symbols with right-to-left localizations to 324 (compared with iOS 14.5’s 251).

iOS 15 System Images ‘Right-to-Left’ collection in Adaptivity v8.0 on 12.9" iPad Pro
iOS 15 System Images ‘Right-to-Left’ collection in Adaptivity v8.0 on 12.9" iPad Pro

Some of the symbols with right-to-left localizations are separate symbols so that a non-right-to-left localized version is also available. Apple uses words such as left and right for symbols which are not right-to-left localized and words such as leading, trailing, forward and backward for symbols which are right-to-left localized.

Adaptivity isn’t localized but it does have an option in its setting screen to force a right-to-left layout. This flips the entire user interface in the same way as the Right-to-Left Pseudolanguage that can be configured in Xcode’s scheme settings when running your own app. The order in which the symbols are listed flips left-to-right (because the whole user interface flips), but only the right-to-left localized symbols actually change appearance.

iOS 15 System Images ‘Right-to-Left’ collection in Adaptivity v8.0 on 12.9" iPad Pro in Right-to-Left layout
iOS 15 System Images ‘Right-to-Left’ collection in Adaptivity v8.0 on 12.9" iPad Pro in Right-to-Left layout

Changes During the iOS 15 Beta

To help developers keep up with changes during the beta cycle, Adaptivity has custom collections to show the changes in beta 2, beta 4 and beta 5. I will add more collections if later betas introduce more changes. I will remove these collections when Apple release iOS 15 because it will no longer be very useful to know what changed during the beta cycle.

Note also that symbols added in iOS 15 which are then renamed in a later beta will not be available under their old names; backwards compatibility only exists for renamed symbols whose original name was in a released version of iOS. Neither Adaptivity nor Apple’s SF Symbols app will show names that only existed during the beta cycle.

iOS 15 Beta 2

There were changes to 53 symbols in iOS 15 beta 2. Adaptivity only shows 48 because 5 of them were renamed in beta 5 and the beta 2 names no longer work.

The 4 filled digital crown images added in iOS 15 had the position of the fill moved to the end:

digitalcrown.arrow.clockwise.fill
digitalcrown.arrow.counterclockwise.fill
digitalcrown.horizontal.arrow.clockwise.fill
digitalcrown.horizontal.arrow.counterclockwise.fill

5 symbols that existed before iOS 15 were renamed. One is a change from using fill to filled:

rectangle.inset.fill → rectangle.inset.filled

The 4 other renamed symbols were renamed again in beta 5 so the “new” names listed below will not work on beta 5 or later:

rectangle.3.offgrid → rectangles.grouprectangle.3.offgrid.fill → rectangles.group.fillrectangle.3.offgrid.bubble.left → rectangles.group.bubble.leftrectangle.3.offgrid.bubble.left.fill → rectangles.group.bubble.left.fill

44 new images were added but landscape.artframe was renamed photo.artframe in beta 5 and is no longer included in Adaptivity’s beta 2 collection:

airtag
airtag.fill
airtag.radiowaves.forward
airtag.radiowaves.forward.fill
alternatingcurrent
antenna.radiowaves.left.and.right.slash
applewatch.case.inset.filled
cable.connector.horizontal
chart.line.uptrend.xyaxis.circle
chart.line.uptrend.xyaxis.circle.fill
circle.dotted
digitalcrown.horizontal.press
digitalcrown.horizontal.press.fill
digitalcrown.press
digitalcrown.press.fill
ear.and.waveform
gear.badge.checkmark
gear.badge.questionmark
gear.badge.xmark
globe.badge.chevron.backward
hand.raised.square.on.square
hand.raised.square.on.square.fill
iphone.homebutton.radiowaves.left.and.right.circle
iphone.homebutton.radiowaves.left.and.right.circle.fill
iphone.radiowaves.left.and.right.circle
iphone.radiowaves.left.and.right.circle.fill
landscape.artframe
network.badge.shield.half.filled
person.badge.clock
person.badge.clock.fill
person.crop.circle.badge.clock
person.crop.circle.badge.clock.fill
person.wave.2
person.wave.2.fill
plus.square.dashed
point.3.connected.trianglepath.dotted
point.3.filled.connected.trianglepath.dotted
rectangle.inset.filled.and.person.filled
shareplay.slash
slider.horizontal.2.rectangle.and.arrow.triangle.2.circlepath
sparkles.tv
sparkles.tv.fill
teletype.answer.circle
teletype.answer.circle.fill
iOS 15 System Images ‘iOS 15 beta 2’ collection in Adaptivity v8.0 on 12.9" iPad Pro
iOS 15 System Images ‘iOS 15 beta 2’ collection in Adaptivity v8.0 on 12.9" iPad Pro

iOS 15 Beta 3

Beta 3 didn’t add or rename any symbols, but it might have changed the supported rendering modes for some symbols. I cannot be sure until Apple release a new version of their SF Symbols app and I examine the properties of each image.

iOS 15 Beta 4

There were changes to 74 symbols in iOS 15 beta 4. Two symbols that existed before iOS 15 were renamed:

doc.text.fill.viewfinder → doc.viewfinder.filldoc.text.viewfinder → doc.viewfinder

These symbols also changed their appearance and, as a result, no longer have right-to-left localizations. Duraid Abdul tweeted that the humidity symbols also changed their appearance. The screenshots below show these symbols in iOS 15 beta 3 (left) and beta 4 (right):

iOS 15 System Images differences between beta 3 and 4 in Adaptivity v8.0 on iPhone 12 Pro

72 new images were added. Most of these are adding .circle and .circle.fill variants of existing symbols. The Beats Studio Buds and MagSafe symbols are restricted:

align.horizontal.center
align.horizontal.center.fill
align.horizontal.left
align.horizontal.left.fill
align.horizontal.right
align.horizontal.right.fill
align.vertical.bottom
align.vertical.bottom.fill
align.vertical.center
align.vertical.center.fill
align.vertical.top
align.vertical.top.fill
beats.studiobud.left
beats.studiobud.right
beats.studiobuds
beats.studiobuds.chargingcase
beats.studiobuds.chargingcase.fill
book.closed.circle
book.closed.circle.fill
books.vertical.circle
books.vertical.circle.fill
bubble.left.circle
bubble.left.circle.fill
bubble.right.circle
bubble.right.circle.fill
building.columns.circle
building.columns.circle.fill
clock.circle
clock.circle.fill
cup.and.saucer
cup.and.saucer.fill
diamond.circle
diamond.circle.fill
dot.circle.viewfinder
dot.viewfinder
drop.circle
drop.circle.fill
ellipsis.curlybraces
exclamationmark.bubble.circle
exclamationmark.bubble.circle.fill
figure.roll
flame.circle
flame.circle.fill
graduationcap.circle
graduationcap.circle.fill
hourglass.circle
hourglass.circle.fill
lightbulb.circle
lightbulb.circle.fill
magsafe.batterypack
magsafe.batterypack.fill
mappin.slash.circle
mappin.slash.circle.fill
newspaper.circle
newspaper.circle.fill
pills.circle
pills.circle.fill
quote.closing
quote.opening
rectangle.center.inset.filled.badge.plus
scissors.circle
scissors.circle.fill
scooter
shippingbox.circle
shippingbox.circle.fill
snowflake.circle
snowflake.circle.fill
sparkle.magnifyingglass
square.and.arrow.up.circle
square.and.arrow.up.circle.fill
stethoscope.circle
stethoscope.circle.fill
iOS 15 System Images ‘iOS 15 beta 4’ collection in Adaptivity v8.0 on 12.9" iPad Pro
iOS 15 System Images ‘iOS 15 beta 4’ collection in Adaptivity v8.0 on 12.9" iPad Pro

iOS 15 Beta 5

There were 31 renamed symbols in iOS 15 beta 4. Two of them were added in the first iOS 15 beta (the original names no longer work):

rectangle.stack.badge.play.crop → rectangle.stack.badge.playrectangle.stack.fill.badge.play.crop.fill → rectangle.stack.badge.play.fill

landscape.artframe was added in beta 2 but is now photo.artframe.

The following four symbols existed before iOS 15, were renamed in beta 2 but have been renamed again. The names on the left are the pre-iOS 15 names (the beta 2 names no longer work):

rectangle.3.offgrid → rectangle.3.grouprectangle.3.offgrid.fill → rectangle.3.group.fillrectangle.3.offgrid.bubble.left → rectangle.3.group.bubble.leftrectangle.3.offgrid.bubble.left.fill → rectangle.3.group.bubble.left.fill

The remaining 24 renames are of symbols that existed before iOS 15:

arrow.up.and.down.righttriangle.up.fill.righttriangle.down.fill → arrow.up.and.down.righttriangle.up.righttriangle.down.fillarrowtriangle.left.fill.and.line.vertical.and.arrowtriangle.right.fill → arrowtriangle.left.and.line.vertical.and.arrowtriangle.right.fillarrowtriangle.right.fill.and.line.vertical.and.arrowtriangle.left.fill → arrowtriangle.right.and.line.vertical.and.arrowtriangle.left.fillcircle.fill.square.fill → circle.square.fillcircle.grid.cross.down.fill → circle.grid.cross.down.filledcircle.grid.cross.left.fill → circle.grid.cross.left.filledcircle.grid.cross.right.fill → circle.grid.cross.right.filledcircle.grid.cross.up.fill → circle.grid.cross.up.filleddpad.down.fill → dpad.down.filleddpad.left.fill → dpad.left.filleddpad.right.fill → dpad.right.filleddpad.up.fill → dpad.up.filledrectangle.stack.fill.badge.person.crop → rectangle.stack.badge.person.crop.fillslider.horizontal.below.square.fill.and.square → slider.horizontal.below.square.filled.and.squaresmallcircle.fill.circle → smallcircle.filled.circlesmallcircle.fill.circle.fill → smallcircle.filled.circle.fillsquare.2.stack.3d.bottom.fill → square.2.stack.3d.bottom.filledsquare.2.stack.3d.top.fill → square.2.stack.3d.top.filledsquare.3.stack.3d.bottom.fill → square.3.stack.3d.bottom.filledsquare.3.stack.3d.middle.fill → square.3.stack.3d.middle.filledsquare.3.stack.3d.top.fill → square.3.stack.3d.top.filledsquare.and.line.vertical.and.square.fill → square.and.line.vertical.and.square.filledsquare.fill.and.line.vertical.and.square → square.filled.and.line.vertical.and.squaresquare.grid.3x1.fill.below.line.grid.1x2 → square.grid.3x1.below.line.grid.1x2.fill

3 new images were added in beta 5:

personalhotspot.circle
personalhotspot.circle.fill
location.magnifyingglass
iOS 15 System Images ‘iOS 15 beta 4’ collection in Adaptivity v8.0 on 12.9" iPad Pro
iOS 15 System Images ‘iOS 15 beta 4’ collection in Adaptivity v8.0 on 12.9" iPad Pro

iOS 15 Beta 6, 7 and 8

Beta 6/7/8 didn’t come with a new Xcode beta so I’ve not been able to check if any new symbols have been added. I know there has not been any renames of symbols added (or renamed) in iOS 15 because all the symbol names I used in Adaptivity still work.

It’s possible that some symbols added in earlier iOS versions have been renamed in beta 6/7/8 and the backward-compatibility is keeping the older names working. I cannot be sure until Apple release a new version of their SF Symbols app and I examine the properties of each image.

iOS 15 Release Candidate

The release candidate did come with a new Xcode beta. There are no new symbols compared with beta 5. At the time of writing (15th September 2021), Apple’s own SF Symbols app has not been updated since beta 2.

Apple

WWDC 2021: 10097, What’s new in SF Symbols

WWDC 2021: 10288, Explore the SF Symbols 3 app

WWDC 2021: 10251, SF Symbols in UIKit and AppKit

WWDC 2021: 10349, SF Symbols in SwiftUI

WWDC 2020: 10207, SF Symbols 2

WWDC 2019: 206, Introducing SF Symbols

Human Interface Guidelines: SF Symbols

SF Symbols Mac app

Other Articles

SF Symbols Changes in iOS 14

SF Symbols Changes in iOS 14.2

SF Symbols Changes in iOS 14.5

The Complete Guide to SF Symbols by Paul Hudson.

SF Symbols: The benefits and how to use them guide by Antoine van der Lee.

Adaptivity

The screenshots in this article were taken from a pre-release version of Adaptivity v8.0. The app has many features which can make it more useful than Apple’s SF Symbols app for browsing the symbols:

  • runs on your iPhone, iPad and Mac
Context Menu in System Images view in Adaptivity v8.0 on 12.9" iPad Pro
Context Menu in System Images view in Adaptivity v8.0 on 12.9" iPad Pro
  • view a symbol at different scales and weights for a range of dynamic type sizes:
iOS 15 System Images detail view in Adaptivity v8.0 on iPhone 12 Pro
iOS 15 System Images detail view in Adaptivity v8.0 on iPhone 12 Pro
  • supports multiple windows on iPad and Mac so that, for example, you can browse two different symbol sets at the same time and compare them:
Comparing symbols that are new in iOS 14.5 and 15 in Adaptivity v8.0 on 12.9" iPad Pro
Comparing symbols that are new in iOS 14.5 and 15 in Adaptivity v8.0 on 12.9" iPad Pro

Adaptivity has many other features. It is primarily a tool to visualize the different window sizes, layout margins, readable content guides, bar heights and Dynamic Type sizes that a modern, adaptive, iOS app uses when running on different devices and iPad multitasking sizes. There are also views for browsing System Colors, System Fonts and System Materials, and a view for exploring iPadOS Pointer Interactions. In iOS/iPadOS 15 you can also configure UISheetPresentationController options for modally-presented view controllers.

The app is a universal purchase and includes the Mac Catalyst version. On macOS 11 and later, this is “optimised for Mac” with native controls and does not scale content. If you are an iOS developer or designer, I’m sure you will find Adaptivity very useful. Testimonials, more screenshots and information on all the features is available on my web site.

Other Articles That You Might Like

I have written articles on How iOS Apps Adapt to the various iPhone 12 Screen Sizes, Bringing Adaptivity to Mac Catalyst, How to Switch Your iOS App and Scene Delegates for Improved Testing and the View Controller Presentation Changes in iOS 13.

The search algorithm used in Adaptivity’s System Colors and System Images views is described in A Simple, Smart Search Algorithm for iOS in Swift. I have also written about Working with Multiple Versions of Xcode and how to Hide Sensitive Information in the iOS App Switcher Snapshot Image.

If you found any of these articles helpful then please take a look at my apps in the iOS App Store to see if there’s anything that you’d like to download (especially the paid ones 😀).

If you work with a lot of Xcode projects you might like my Mac Menu Bar utility XcLauncher. It’s like having browser bookmarks for your favorite Xcode projects, workspaces, playgrounds, and Swift packages. There is more information on my website about XcLauncher’s features.

Independent and freelance software developer for iPhone, iPad and Mac