Custom Fonts

Once you have added the studio boilerplate SCSS to the Custom Styles of your book (see Studio Boilerplate SCSS), you will have access to the following fonts in addition to the Pressbooks theme defaults:

  • Montserrat – This is a Test Fanshawe OER Design Studio
  • Open Sans  – This is a Test Fanshawe OER Design Studio
  • Roboto – This is a Test Fanshawe OER Design Studio
  • Lato – This is a Test Fanshawe OER Design Studio
  • Oswald – This is a Test Fanshawe OER Design Studio
  • Public Sans – This is a Test Fanshawe OER Design Studio
  • Radio Canada – This is a Test Fanshawe OER Design Studio
  • Noto Sans – This is a Test Fanshawe OER Design Studio
  • Krub – This is a Test Fanshawe OER Design Studio
  • El Messiri – This is a Test Fanshawe OER Design Studio
  • Comic Neue – This is a Test Fanshawe OER Design Studio
  • Akaya Kanadaka – This is a Test Fanshawe OER Design Studio
  • Gaegu – This is a Test Fanshawe OER Design Studio
  • Coming Soon – This is a Test Fanshawe OER Design Studio
  • Space Grotesk – This is a Test Fanshawe OER Design Studio
  • McLaren – This is a Test Fanshawe OER Design Studio

Montserrat is set as the default font by the boilerplate code. You can set the global font variables for secondary font, cursive font, and ornamental font in your custom styles and then use them in your page HTML like this:

<span style="font-family: var(--ornamental-font), sans-serif;">Text in ornamental font</span>

Or you can use the font names directly in a similar fashion (note that font names containing white space need to be enclosed in single quotes):

<span style="font-family: 'El Messiri', sans-serif;">Text in El Messiri</span>

If there is a need for a different font than the ones available, it can be imported in your custom styles from Google Fonts. Please ensure that any fonts used are accessible and appropriate. When you have chosen the font you want to import, make sure you grab the @import embed code for web and paste it into the custom styles of your book for web, PDF, and eBook.

Note that Google Fonts remembers your history of selecting fonts, and your embed tag will contain all of the fonts you have previously selected as well as the current one, so please clear your selected font history in Google Fonts before selecting fonts for studio resources so that you are not adding superfluous fonts!

 

 

License

Icon for the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License

Fanshawe OER Training Guide Copyright © 2024 by Fanshawe College is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License, except where otherwise noted.

Share This Book