Skip to content

Instantly share code, notes, and snippets.

@thelebster
Forked from szeidler/loop-fontfiles.scss
Created October 22, 2016 05:44
Show Gist options
  • Select an option

  • Save thelebster/e0d7c04a8db173a37d328a79f8b5beba to your computer and use it in GitHub Desktop.

Select an option

Save thelebster/e0d7c04a8db173a37d328a79f8b5beba to your computer and use it in GitHub Desktop.
Generate @font-face for a whole font familiy in several file formats.
/*
* See: http://www.oliverdavies.co.uk/blog/include-css-fonts-using-sass-each-loop
* Usage: font-family: "FuturaBook";
*/
@each $family in FuturaBook, FuturaBold, FuturaBoldItalic, FuturaItalic {
@font-face {
font-family: #{$family};
src: url('../fonts/#{$family}/#{$family}.eot');
src: url('../fonts/#{$family}/#{$family}.eot?#iefix') format('embedded-opentype'),
url('../fonts/#{$family}/#{$family}.woff') format('woff'),
url('../fonts/#{$family}/#{$family}.ttf') format('truetype'),
url('../fonts/#{$family}/#{$family}.svg##{$family}') format('svg');
font-weight: normal;
font-style: normal;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment