Stack Overflow
Stack Overflow

Questions tagged [sf-symbols]

SF Symbols is a font containing configurable symbols for use on Apple platforms (iOS, macOS, tvOS, and watchOS). It is also a macOS application for exploring the font, exporting symbols from the font as SVG, and creating new symbols in the style of the font. Use this tag to discuss the use of the SF Symbols font and (where applicable to programming) the SF Symbols application.

Apple announced and released the SF Symbols font and the SF Symbols application at WWDC on June 3, 2019. Apple describes the font as follows:

SF Symbols provides a set of over 1,500 consistent, highly configurable symbols you can use in your app. Apple designed SF Symbols to integrate seamlessly with the San Francisco system font, so the symbols automatically ensure optical vertical alignment with text for all weights and sizes. SF Symbols are available in a wide range of weights and scales to help you create adaptable designs.

The SF Symbols font is included in the following operating systems:

  • macOS 10.15 and later,
  • iOS 13 and later,
  • tvOS 13 and later,
  • watchOS 6 and later.

The SF Symbols app runs on macOS 10.14.4 or later. It allows browsing the SF Symbols font, exporting some symbols as SVG, and preparing modified SVG files for importation into an Xcode asset catalog.

62 questions
95
votes
7 answers

Find all available images for Image(systemName:) in SwiftUI

Where can I find all the system images that are available in the initializer Image(systemName:)? I've only been using "chevron" and "star.fill" so far, as discovered in Apple's SwiftUI tutorial series. However, I haven't been able to find a full…
LinusGeffarth
  • 21,607
  • 24
  • 100
  • 152
60
votes
8 answers

How to use SF Symbols in iOS 12 and below?

I am updating the icons in my app. After I heard Apple released an icon font named SF Symbols with iOS 13, I was wondering if I can only use them in iOS 13 or if it is possible to use them in lower versions of iOS too. If I want to use them, do I…
Julian Pomper
  • 833
  • 2
  • 7
  • 15
57
votes
6 answers

How do I set a weight to SF Symbols for iOS 13?

I have this Image(systemName: "arrow.right") But how do I make it bold, semibold etc? I am using the new SwiftUI.
Just a coder
  • 10,809
  • 12
  • 70
  • 112
47
votes
3 answers

How do I set the size of a SF Symbol in SwiftUI?

How do I set the size of a SF Symbol in Xcode 11 using SwiftUI?
Ryan
  • 8,298
  • 9
  • 42
  • 53
26
votes
1 answer

Change a SF Symbol size inside a UIButton

I am declaring a Button like this : let menuButton = UIButton() After that I am trying to change it's parameter and set his position on the view with the help of LBTATools (a pod) with this function: fileprivate func setMenuButtonUI() { …
Cublax
  • 520
  • 5
  • 14
24
votes
2 answers

Is it possible to use SF Symbols outside of UIImage?

I'm confused on how to use SF Symbols in text in an iOS project. I have a UIButton that uses a symbol just fine using UIImage systemImageNamed:. I would like to display a message about that button with some text in another view. I thought I should…
Gene McCulley
  • 649
  • 6
  • 12
24
votes
5 answers

How to change SF Symbols' icon color in UIKit?

In SwiftUI, you can change the icon's color using foregroundColor modifier. So I think there should be a way to change the color in UIKit. I looked up the documentation and didn't find anything related to it. Is it possible right now? let iconImage…
francisfeng
  • 394
  • 1
  • 5
  • 19
23
votes
5 answers

Is there a way to change the stroke/fill color of a sf symbol icon in swiftui?

I am looking for a way to change the stroke / fill color of a sf symbol icon in swiftui. I have tried .background(Color.red) but that just changes the background of the whole icon (no change is applied to the actual icon itself) as implied then I…
Taylor Miller-Klugman
  • 233
  • 1
  • 2
  • 6
16
votes
3 answers

Use SF Symbols system image for static UIApplicationShortcutItem

When specifying home screen quick actions, UIApplicationShortcutItems, in your Info.plist, is there a way to use a system image from SF Symbols? The docs noting the available iOS keys doesn't specify a key to do this, besides specifying one of the…
Jordan H
  • 45,794
  • 29
  • 162
  • 306
7
votes
2 answers

How to format customized SF-Symbols SVG files for import into Xcode11

Has anyone figured out how to create customized SF-Symbols using the techniques outlined in the WWDC video, the only existing documentation that I can find on the subject? According to the video one can simply edit the exported SVG file and reimport…
Brandon C.
  • 290
  • 3
  • 8
7
votes
1 answer

HStack with SF Symbols Image not aligned centered

I have this simple SwiftUI code. I want all symbols to be aligned centered, just like the cloud symbol. struct ContentView : View { var body: some View { HStack(alignment: .center, spacing: 10.0) { Image(systemName: "cloud.sun") …
Daniel
  • 2,227
  • 2
  • 27
  • 51
5
votes
1 answer

Is there a way to use the apple SF Symbols on the web

I am trying to make a website and was hoping to use Apple's SF Symbols for some icons, however I can not find a way to get SF Icons onto a website, I downloaded the app and copied the icon however on the website it shows a blank square. Any help…
Samo2120
  • 97
  • 6
5
votes
3 answers

How to center a SF Symbols image vertically in UITabBarItem?

I am using SF Symbols images as tab images in my iOS app by assigning them as follows: self.tabBarItem.image = UIImage(systemName: "ellipsis") This results in all images being top-aligned, but I would like to have them centered vertically. What…
iosdeveloper
  • 123
  • 1
  • 1
  • 5
5
votes
3 answers

Using Xcode/Swift, how can I use an SF Symbol as a tab bar icon in assets? The asset field won't accept the .svg file

I can't use an SF Symbol as an asset for a tab bar icon. I tried using the GUI to drag and drop the file. I'm unsure of how to add it programatically. I expected to be able to drag/drop but it won't accept the .svg file. I add a new symbol set but…
Paul Drees
  • 53
  • 1
  • 5
4
votes
2 answers

How do you align SF Symbols with one another in a UITableView?

In the WWDC SF Symbols video, Apple says to prefer horizontal and vertical alignment when displaying SF Symbols. Presumably, that means that each UIImageView.center.x should contain the same value so that they line up in a column. My question is how…
rickharrison
  • 4,797
  • 3
  • 31
  • 39
1
2 3 4 5