Supports European and Middle Eastern scripts (Latin, Greek, Cyrillic, Arabic, Armenian, and Hebrew). Regular, Italic, Bold, Bold Italic, Black Sans-serif fonts are a great choice for headings and UI elements. Light, Semilight, Regular, Semibold, Bold
User-interface font for Arabic, Armenian, Georgian, and Hebrew. Regular, Italic, Light Italic, Black Italic, Bold, Bold Italic, Light, Semilight, Semibold, Black User-interface font for South Asian scripts (Bangla, Chakma, Devanagari, Gujarati, Gurmukhi, Kannada, Malayalam, Meetei Mayek, Odia, Ol Chiki, Sinhala, Sora Sompeng, Tamil, Telugu). User-interface font for Simplified Chinese.
User-interface font for Traditional Chinese. User-interface font for Southeast Asian scripts (Buginese, Khmer, Lao, Thai). User-interface font for North American scripts (Canadian Syllabics, Cherokee, Osage). User-interface font for African scripts (ADLaM, Ethiopic, N'Ko, Osmanya, Tifinagh, Vai). Fonts for non-Latin languages Font-family For more info, see Adjusting layout and fonts to support globalization. The LanguageFont object provides access to the correct font info for various categories of content including UI headers, notifications, body text, and user-editable document body fonts. Use the LanguageFont font-mapping APIs for programmatic access to the recommended font family, size, weight, and style for a particular language. For other languages, see the following recommendations. Segoe UI Variable is our font for English, European languages, Greek, and Russian. If containers are not well-defined (for example, no differentiating background color), or when there is a link to see more text, then use ellipses. The scaling algorithm ensures that a 24 px font on Surface Hub 10 feet away is just as legible as a 24 px font on 5" phone that's a few inches away.īecause of how the scaling system works, you're designing in effective pixels, not actual physical pixels, and you shouldn't have to alter font sizes for different screens sizes or resolutions.
Size and scalingįont sizes in UWP apps automatically scale on all devices. When using HTML, optical scaling is also automatic, but you will need to specify the Segoe UI Variable font in CSS. When this font or another variable font with an optical axis is used, the optical size will automatically match the requested font-size. When using XAML common controls, the Segoe UI Variable font will be selected by default for supported languages. It also has an optical size axis ( opsz) for optical scaling from 8pt to 36pt. This font has a weight axis ( wght) with weights from Thin (100) to Bold (700). The Segoe UI Variable font contains two axes for finer control of text.