Typography

Customizing Typography

Note: The information on this page is specific to Version 3, for Version 2 information on typography go to the Version 2 guide.

What is typography?

Typography is a way of arranging type to make text legible, readable, and appealing when displayed. The theming system supports customizing the typography settings for the library's components. Additionally, Ngs provides APIs for applying typography styles to elements in your own application.

Including font assets

Typography APIs lets you specify any font-face. The default font-face value is configured to Google's Roboto font with the 300, 400, and 500 font-weight styles. To use Roboto, your application must load the font. The easiest way to load Roboto, or any other custom font, is by using Google Fonts. The following snippet can be placed in your application's to load Roboto from Google Fonts.

Inline text elements

You can use the mark tag to highlight text.

~~This line of text is meant to be treated as deleted text.~~

~~This line of text is meant to be treated as no longer accurate.~~

This line of text is meant to be treated as an addition to the document.

This line of text will render as underlined

This line of text is meant to be treated as fine print.

This line rendered as bold text.

This line rendered as italicized text.