Skip to content

Instantly share code, notes, and snippets.

@fernandofleury
Last active December 24, 2015 16:09
Show Gist options
  • Save fernandofleury/6825858 to your computer and use it in GitHub Desktop.
Save fernandofleury/6825858 to your computer and use it in GitHub Desktop.
font-face example
// COMPASS GENERATOR
+font-face("Helvetica Neue", font-files("helvetica-neue.woff", "helvetica-neue.ttf", "helvetica-neue.svg"), "helvetica-neue.eot", normal, normal)
+font-face("Helvetica Neue", font-files("helvetica-neue_light.woff", "helvetica-neue_light.ttf", "helvetica-neue_light.svg"), "helvetica-neue_light.eot", 300, normal)
+font-face("Helvetica Neue", font-files("helvetica-neue_bold.woff", "helvetica-neue_bold.ttf", "helvetica-neue_bold.svg"), "helvetica-neue_bold.eot", 700, normal)
+font-face("Helvetica Neue", font-files("helvetica-neue_italic.woff", "helvetica-neue_italic.ttf", "helvetica-neue_italic.svg"), "helvetica-neue_italic.eot", normal, italic)
// RESULT
@font-face {
font-family: "Helvetica Neue";
src: url('../fonts/helvetica-neue.eot');
src: url('../fonts/helvetica-neue.eot?#iefix') format('eot'), url('../fonts/helvetica-neue.woff') format('woff'), url('../fonts/helvetica-neue.ttf') format('truetype'), url('../fonts/helvetica-neue.svg') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Helvetica Neue";
src: url('../fonts/helvetica-neue_light.eot');
src: url('../fonts/helvetica-neue_light.eot?#iefix') format('eot'), url('../fonts/helvetica-neue_light.woff') format('woff'), url('../fonts/helvetica-neue_light.ttf') format('truetype'), url('../fonts/helvetica-neue_light.svg') format('svg');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: "Helvetica Neue";
src: url('../fonts/helvetica-neue_bold.eot');
src: url('../fonts/helvetica-neue_bold.eot?#iefix') format('eot'), url('../fonts/helvetica-neue_bold.woff') format('woff'), url('../fonts/helvetica-neue_bold.ttf') format('truetype'), url('../fonts/helvetica-neue_bold.svg') format('svg');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: "Helvetica Neue";
src: url('../fonts/helvetica-neue_italic.eot');
src: url('../fonts/helvetica-neue_italic.eot?#iefix') format('eot'), url('../fonts/helvetica-neue_italic.woff') format('woff'), url('../fonts/helvetica-neue_italic.ttf') format('truetype'), url('../fonts/helvetica-neue_italic.svg') format('svg');
font-weight: normal;
font-style: italic;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment