Skip to content

Instantly share code, notes, and snippets.

@espinozaulises
Last active November 20, 2019 09:46
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save espinozaulises/6628541 to your computer and use it in GitHub Desktop.
Save espinozaulises/6628541 to your computer and use it in GitHub Desktop.
Open Sans @font-face CSS file
/*==========================================================
Open Sans
==========================================================*/
@fontPath: '../fonts'; /* LESS Syntaxis. Replace this in CSS */
@font-face {
font-family: 'OpenSansLight';
src: url('@{fontPath}/OpenSans-Light-webfont.eot');
src: url('@{fontPath}/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
url('@{fontPath}/OpenSans-Light-webfont.woff') format('woff'),
url('@{fontPath}/OpenSans-Light-webfont.ttf') format('truetype'),
url('@{fontPath}/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'OpenSansLightItalic';
src: url('@{fontPath}/OpenSans-LightItalic-webfont.eot');
src: url('@{fontPath}/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
url('@{fontPath}/OpenSans-LightItalic-webfont.woff') format('woff'),
url('@{fontPath}/OpenSans-LightItalic-webfont.ttf') format('truetype'),
url('@{fontPath}/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic') format('svg');
font-weight: 300;
font-style: italic;
}
@font-face {
font-family: 'OpenSansRegular';
src: url('@{fontPath}/OpenSans-Regular-webfont.eot');
src: url('@{fontPath}/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
url('@{fontPath}/OpenSans-Regular-webfont.woff') format('woff'),
url('@{fontPath}/OpenSans-Regular-webfont.ttf') format('truetype'),
url('@{fontPath}/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'OpenSansItalic';
src: url('@{fontPath}/OpenSans-Italic-webfont.eot');
src: url('@{fontPath}/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
url('@{fontPath}/OpenSans-Italic-webfont.woff') format('woff'),
url('@{fontPath}/OpenSans-Italic-webfont.ttf') format('truetype'),
url('@{fontPath}/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'OpenSansSemibold';
src: url('@{fontPath}/OpenSans-Semibold-webfont.eot');
src: url('@{fontPath}/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
url('@{fontPath}/OpenSans-Semibold-webfont.woff') format('woff'),
url('@{fontPath}/OpenSans-Semibold-webfont.ttf') format('truetype'),
url('@{fontPath}/OpenSans-Semibold-webfont.svg#OpenSansSemibold') format('svg');
font-weight: bolder;
font-style: normal;
}
@font-face {
font-family: 'OpenSansSemiboldItalic';
src: url('@{fontPath}/OpenSans-SemiboldItalic-webfont.eot');
src: url('@{fontPath}/OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'),
url('@{fontPath}/OpenSans-SemiboldItalic-webfont.woff') format('woff'),
url('@{fontPath}/OpenSans-SemiboldItalic-webfont.ttf') format('truetype'),
url('@{fontPath}/OpenSans-SemiboldItalic-webfont.svg#OpenSansSemiboldItalic') format('svg');
font-weight: bolder;
font-style: italic;
}
@font-face {
font-family: 'OpenSansBold';
src: url('@{fontPath}/OpenSans-Bold-webfont.eot');
src: url('@{fontPath}/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
url('@{fontPath}/OpenSans-Bold-webfont.woff') format('woff'),
url('@{fontPath}/OpenSans-Bold-webfont.ttf') format('truetype'),
url('@{fontPath}/OpenSans-Bold-webfont.svg#OpenSansSemiboldItalic') format('svg');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'OpenSansBoldItalic';
src: url('@{fontPath}/OpenSans-BoldItalic-webfont.eot');
src: url('@{fontPath}/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
url('@{fontPath}/OpenSans-BoldItalic-webfont.woff') format('woff'),
url('@{fontPath}/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
url('@{fontPath}/OpenSans-BoldItalic-webfont.svg#OpenSansSemiboldItalic') format('svg');
font-weight: bold;
font-style: italic;
}
@font-face {
font-family: 'OpenSansExtraBold';
src: url('@{fontPath}/OpenSans-ExtraBold-webfont.eot');
src: url('@{fontPath}/OpenSans-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
url('@{fontPath}/OpenSans-ExtraBold-webfont.woff') format('woff'),
url('@{fontPath}/OpenSans-ExtraBold-webfont.ttf') format('truetype'),
url('@{fontPath}/OpenSans-ExtraBold-webfont.svg#OpenSansSemiboldItalic') format('svg');
font-weight: bold;
font-style: italic;
}
@font-face {
font-family: 'OpenSansExtraBoldItalic';
src: url('@{fontPath}/OpenSans-ExtraBoldItalic-webfont.eot');
src: url('@{fontPath}/OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
url('@{fontPath}/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
url('@{fontPath}/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'),
url('@{fontPath}/OpenSans-ExtraBoldItalic-webfont.svg#OpenSansSemiboldItalic') format('svg');
font-weight: bold;
font-style: italic;
}
@FranciscoMoreira32
Copy link

Where do you found the font in the various formats?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment