How to use an @each loop in SASS to quickly include multiple font files within
your stylesheet.
Using a file structure similar to this, organise your font files into
directories, using the the font name for both the directory name and for the
file names.
Within your SASS file, start an @each loop, listing the names of the fonts. In
the same way as PHP's foreach loop, each font name will get looped through
using the $family variable and then compiled into CSS.
When the CSS has been compiled, you can then use in your CSS in the standard
way.
font-family: "FuturaBook";
Was this useful?
About me
I'm an Acquia-certified Drupal Triple Expert with 17 years of experience, an open-source software maintainer and Drupal core contributor, public speaker, live streamer, and host of the Beyond Blocks podcast.