How to use SF Rounded font in SwiftUI?

Question

I am trying to use the SF rounded font in my SwiftUI project, how would you set it?

I already tried messing around with the .font() but it didn't work (I wasn't able to set it to this rounded font)

Gayomart

How to set it without SwiftUI ? – Hag

@MarvinRuciński There's a new UIKit API in iOS 13 called UIFontDescriptor.SystemDesign – Judicature

Answer 1

Text("Your Text").font(.system(.body, design: .rounded))

Exclave

Answer 2

I know the question is about SwiftUI, but I thought it could be helpful to also include an UIKit answer.

let fontSize: CGFloat = 24

// Here we get San Francisco with the desired weight
let systemFont = UIFont.systemFont(ofSize: fontSize, weight: .regular)

// Will be SF Compact or standard SF in case of failure.
let font: UIFont

if let descriptor = systemFont.fontDescriptor.withDesign(.rounded) {
    font = UIFont(descriptor: descriptor, size: fontSize)
} else {
    font = systemFont
}

Drava

Answer 3

Doing it this way works for me on a Text object in SwiftUI:

.font(.system(size: 13.0, weight: .regular, design: .rounded))

Discursion

Answer 4

Converted the UIKit answer by @Pomme2Poule into a function for easy use, should anyone need it. Function uses dynamic type too, so it'll scale with the font size.

func roundedFont(ofSize style: UIFont.TextStyle, weight: UIFont.Weight) -> UIFont {
    // Will be SF Compact or standard SF in case of failure.
    let fontSize = UIFont.preferredFont(forTextStyle: style).pointSize
    if let descriptor = UIFont.systemFont(ofSize: fontSize, weight: weight).fontDescriptor.withDesign(.rounded) {
        return UIFont(descriptor: descriptor, size: fontSize)
    } else {
        return UIFont.preferredFont(forTextStyle: style)
    }
}

Falciform

Answer 5

Thought I'd add an extra use case: if you would like to apply a custom font weight to your rounded SF font on something like a text field, while still maintaining dynamic font scaling, you can do the following:

TextField("test", $test)
    .font(Font.system(.largeTitle, design: .rounded).weight(.heavy))

This is required since one cannot call .fontWeight() directly on a TextField (at least as of iOS 13).

Consul

Answer 6

iOS >16.1

Use fontDesign(.rounded)

Text("Hello, World!")
    .fontDesign(.rounded)

Courteous