Bolt Design System

Font-family Usage

<bolt-text> has a few options to change typefaces. These options are relative to the types of text such as heading, body, and code. Each type is linked to a specific typeface. This method accounts for our evolving brand.

This text has its font-family prop defined as: headline

<bolt-text font-family="headline">
  This text has its font-family prop defined as: headline
</bolt-text>

This text has its font-family prop defined as: body

<bolt-text font-family="body">
  This text has its font-family prop defined as: body
</bolt-text>

This text has its font-family prop defined as: code

<bolt-text font-family="code">
  This text has its font-family prop defined as: code
</bolt-text>