How Dynamic Type sizes work in SwiftUI

SwiftUI contains a number of pre-defined text styles and sizes available to use in your prototype or app. These are declared in the .font() modifier from a list of styles used throughout iOS, and sized especially for Apple screens. And being “dynamic”, these type sizes come with a super-power—they respond to the needs to the phone’s owner.

Dynamic Type sizes are not just for accessible customers, the flexible sizing allows any person to increase and decrease the text on their devices. The default size category is Large, and there are three smaller and three larger categories. (xSmall, Small, Medium, Large, xLarge, xxLarge, and xxxLarge). Five additional larger sizes are available in the Accessibility settings.

The full point size table is available in Apple’s Human Interface Guidelines document. This table not only shows you the default type sizes, there are also columns for weight and leading corresponding with the style name. This is a valuable reference table even using working in Figma and needing to know what the default text and leading measurements are.

Large (default) Dynamic Type sizes for iOS and iPadOS

Style Weight Size Leading
Large Title Regular 34 41
Title 1 Regular 28 34
Title 2 Regular 22 28
Title 3 Regular 20 25
Headline Semibold 17 22
Body Regular 17 22
Callout Regular 16 21
Subhead Regular 15 20
Footnote Regular 13 18
Caption 1 Regular 12 16
Caption 2 Regular 11 13

You can check your own iPhone for the size you’re currently using. In Settings, tap on “Display & Brightness” (it’s a few items below General). Below the Light & Dark appearance is the “Text Size” option. Inside “Text Size” you will find a slider with seven steps. Maybe your setting is in the middle or to the left, and possibly you have the text size set higher. This screen also has a note: “Apps that support Dynamic Type will adjust to your preferred reading size…,” so if you want your app to be universal, ensure you use Dynamic Type sizes.

Now in your designs, you may find the default text styles don’t fit your brand. And you may not need to worry about changing the text size during your usability testing, especially if you’re using a testing device, but there are still several benefits to using Dynamic Type sizing in your prototype app. An obvious benefit is to ensure the app is accessible to all customers.

One important reason is for you to see how changing the phone’s text size will impact your designs. These are states to your design that should be considered, and complicated layouts can easily break. Better to test and adjust the design before sending the specs off to your developers, or worse, finding out during QA that the app design completely falls apart.