Skip to content

Instantly share code, notes, and snippets.

@ClementParis016
Created August 3, 2016 17:16
Show Gist options
  • Save ClementParis016/1f0eee762d89769be10b0aea38f90799 to your computer and use it in GitHub Desktop.
Save ClementParis016/1f0eee762d89769be10b0aea38f90799 to your computer and use it in GitHub Desktop.
A SCSS mixin for @font-face declarations with support for font-weight, font-style and font-stretch
@mixin font-face($name, $file, $weight, $style, $stretch) {
@font-face {
font-family: $name;
src: url('#{$file}.woff') format('woff'); // Add more of these if need multiple font formats for broader browser support
font-weight: $weight;
font-style: $style;
font-stretch: $stretch;
}
}
/*
* Sample use:
* @include font-face("Chronicle", "../fonts/chronicle-display-condensed-light", 300, normal, condensed);
*/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment