Go Main page
cover

our themes

Typography

One of the key elements in our apps is the typeface we use to communicate. By using the correct typeface, we can tie all of our communications together and create visual continuity.

The typography variants remain equal in the different subthemes of Wireframe (Vulcan, Astra and Root).

Font family

  • GT America font family

GT America expanded

  • This is the typography used in the headline text styles.
  • GT America extended

  • This is the typography used in paragraph and links (inline) text styles.
  • Font weight

    GT America expanded

  • light
  • font_weight_300
  • GT America expanded

  • regular
  • font_weight_400
  • GT America expanded

  • medium
  • font_weight_500
  • GT America expanded

  • medium
  • font_weight_600
  • Font scale

    Aa
    Display:
    font_heading_50
    Size:48px / 3 rem
    Line height:56px / 3.5 rem
    Aa
    H1:
    font_heading_100
    Size:40px / 2.5 rem
    Line height:48px / 3 rem
    Aa
    H2:
    font_heading_150
    Size:32px / 2 rem
    Line height:40px / 2.5 rem
    Aa
    H3:
    font_heading_200
    Size:24px / 1.5 rem
    Line height:32px / 2.5 rem
    Aa
    H4:
    font_heading_250
    Size:20px / 1.25 rem
    Line height:24px / 1.5 rem
    Aa
    Paragraph large:
    font_body_50
    Size:18px / 1.125 rem
    Line height:24px / 1.5 rem
    Aa
    Paragraph medium:
    font_body_100
    Size:16px / 1 rem
    Line height:24px / 1.5 rem
    Aa
    Paragraph small:
    font_body_150
    Size:14px / 0.875 rem
    Line height:20px / 1.25 rem
    Aa
    Caption:
    font_body_200
    Size:12px / 0.75 rem
    Line height:16px / 1 rem

    Font alignment

    text-align

  • left
  • text-align

  • center
  • text-align

  • right