Skip to content

Instantly share code, notes, and snippets.

@drewminns
Created May 26, 2014 21:19
Show Gist options
  • Select an option

  • Save drewminns/2925ca1431465fe39913 to your computer and use it in GitHub Desktop.

Select an option

Save drewminns/2925ca1431465fe39913 to your computer and use it in GitHub Desktop.
FontFace Mixin
// Use this mixin to help embed webfonts in your page.
@mixin importfont($font-family, $font-filename, $font-weight : normal, $font-style :normal, $font-stretch : normal) {
@font-face {
font-family: '#{$font-family}';
src: url('#{$font-filename}.eot');
src: url('#{$font-filename}.eot?#iefix') format('embedded-opentype'),
url('#{$font-filename}.woff') format('woff'),
url('#{$font-filename}.ttf') format('truetype'),
url('#{$font-filename}.svg##{$font-family}') format('svg');
font-weight: $font-weight;
font-style: $font-style;
font-stretch: $font-stretch;
}
}
// Reference the font name and insert the path to the font files. Use http://fontprep.com/ to convert fonts to webfonts
@include importfont('Font Name', 'fonts/fontfilename', 400);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment