2.3.4 #Brand.Typefaces.Native Native
The native typeface is a special declaration that tells the browser to use the typeface it uses for things like menus and labels. For macOS, it is San Francisco. For Windows, it is Segoe UI.
Example
Jackdaws love my big sphinx of quartz
Quick wafting zephyrs vex bold Jim.
Bright vixens jump; dozy fowl quack. Both fickle dwarves jinx my pig quiz. Pack my box with five dozen liquor jugs. Few quips galvanized the mock jury box.
A B C D E F G H I J K L M
N O P Q R S T U V W X Y Z
a b c d e f g h i j k l m
n o p q r s t u v w x y z
1 2 3 4 5 6 7 8 9 0
! & @ % $ # ?
Markup
<h2 class="u-font-family-native">Jackdaws love my big sphinx of quartz</h2>
<h3 class="u-font-family-native">Quick wafting zephyrs vex bold Jim.</h3>
<p class="u-font-family-native">Bright vixens jump; dozy fowl quack. Both fickle dwarves jinx my pig quiz. Pack my box with five dozen liquor jugs. Few quips galvanized the mock jury box.</p>
<p class="u-font-family-native">A B C D E F G H I J K L M<br/>N O P Q R S T U V W X Y Z</p>
<p class="u-font-family-native">a b c d e f g h i j k l m<br/>n o p q r s t u v w x y z</p>
<p class="u-font-family-native">1 2 3 4 5 6 7 8 9 0</p>
<p class="u-font-family-native">! & @ % $ # ?</p>
Source:
src/css/brand/_typefaces.scss, line 82