Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
@font-face syntax
/* @font-face: Proxima Nova */
/* Black */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-Black-webfont.eot');
src: url('fonts/ProximaNova-Black-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-Black-webfont.woff') format('woff'),
url('fonts/ProximaNova-Black-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-Black-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 900;
font-style: normal;
}
/* Black Italic */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-BlackIt-webfont.eot');
src: url('fonts/ProximaNova-BlackIt-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-BlackIt-webfont.woff') format('woff'),
url('fonts/ProximaNova-BlackIt-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-BlackIt-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 900;
font-style: italic;
}
/* ExtraBold */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-Xbold-webfont.eot');
src: url('fonts/ProximaNova-Xbold-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-Xbold-webfont.woff') format('woff'),
url('fonts/ProximaNova-Xbold-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-Xbold-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 800;
font-style: normal;
}
/* Extrabold Italic */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-XboldIt-webfont.eot');
src: url('fonts/ProximaNova-XboldIt-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-XboldIt-webfont.woff') format('woff'),
url('fonts/ProximaNova-XboldIt-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-XboldIt-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 800;
font-style: italic;
}
/* Bold */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-Bold-webfont.eot');
src: url('fonts/ProximaNova-Bold-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-Bold-webfont.woff') format('woff'),
url('fonts/ProximaNova-Bold-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-Bold-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 700;
font-style: normal;
}
/* Bold Italic */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-BoldIt-webfont.eot');
src: url('fonts/ProximaNova-BoldIt-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-BoldIt-webfont.woff') format('woff'),
url('fonts/ProximaNova-BoldIt-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-BoldIt-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 700;
font-style: italic;
}
/* SemiBold */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-Sbold-webfont.eot');
src: url('fonts/ProximaNova-Sbold-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-Sbold-webfont.woff') format('woff'),
url('fonts/ProximaNova-Sbold-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-Sbold-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 600;
font-style: normal;
}
/* SemiBold Italic */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-SboldIt-webfont.eot');
src: url('fonts/ProximaNova-SboldIt-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-SboldIt-webfont.woff') format('woff'),
url('fonts/ProximaNova-SboldIt-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-SboldIt-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 600;
font-style: italic;
}
/* Regular */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-Reg-webfont.eot');
src: url('fonts/ProximaNova-Reg-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-Reg-webfont.woff') format('woff'),
url('fonts/ProximaNova-Reg-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-Reg-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 500;
font-style: normal;
}
/* Regular Italic */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-RegIt-webfont.eot');
src: url('fonts/ProximaNova-RegIt-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-RegIt-webfont.woff') format('woff'),
url('fonts/ProximaNova-RegIt-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-RegIt-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 500;
font-style: italic;
}
/* Light */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-Light-webfont.eot');
src: url('fonts/ProximaNova-Light-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-Light-webfont.woff') format('woff'),
url('fonts/ProximaNova-Light-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-Light-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 300;
font-style: normal;
}
/* Light Italic */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-LightIt-webfont.eot');
src: url('fonts/ProximaNova-LightIt-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-LightIt-webfont.woff') format('woff'),
url('fonts/ProximaNova-LightIt-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-LightIt-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 300;
font-style: italic;
}
/* Thin */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-Thin-webfont.eot');
src: url('fonts/ProximaNova-Thin-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-Thin-webfont.woff') format('woff'),
url('fonts/ProximaNova-Thin-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-Thin-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 100;
font-style: normal;
}
/* Thin Italic */
@font-face {
font-family: 'Proxima Nova';
src: url('fonts/ProximaNova-ThinIt-webfont.eot');
src: url('fonts/ProximaNova-ThinIt-webfont.eot?iefix') format('eot'),
url('fonts/ProximaNova-ThinIt-webfont.woff') format('woff'),
url('fonts/ProximaNova-ThinIt-webfont.ttf') format('truetype'),
url('fonts/ProximaNova-ThinIt-webfont.svg#webfontehArT0T9') format('svg');
font-weight: 100;
font-style: italic;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment