27 Apr modified: 5 years ago

Typography Over-Ride

grav ui Bruno Martins | unsplash

The core Grav theme template (Antimatter) comes pre-configured to display two Google fonts downloaded from Google Fonts CDN. The two fonts used in the default configuration are: Montserrat (for all the header and display functions) and Raleway (for body text). Although these fonts are quite a nice combination, it is possible to over-ride these choices for a more individualistic look-and-feel.

There are two files that need to be adjusted:
_typography.scss: /themes/antimatter/scss/configuration/template/_typography.scss
_fonts.scss: /themes/antimatter/scss/template/_fonts.scss

Copy and paste the chunks of code on each of these pages so that the original code is saved intact. Comment-out the duplicate and insert the new font names into the proper areas of the un-commented copies.

The font combination that I've chosen for this site (as of March, 2016) is Oswald for headings and Droid Serif for body text.

By the way, a good site to use when choosing the ideal font combination is: http://fontcdn.org/. Even thought its user interface is not as nice, another site to consider is https://google-webfonts-helper.herokuapp.com/fonts/.

Next Post Previous Post