Join GitHub today
GitHub is home to over 28 million developers working together to host and review code, manage projects, and build software together.Sign up
How to use fontello fonts in your project
Fontello generates archive with fonts, css files and docs. Here are recommendation, how to use one in your project to show icons.
- Copy ALL files with folder structure into your project, without change. That will simplify future font updates.
- If you need to change
@fontfaceparams - use
<your_font_name>-codes.css, and define
@fontfacerule in outer files. That will help to keep fontello folder intact, and will prevent mistakes on upgrade, when you overwrite content with new font version.
- Also, having your own
@font-facewill allow to use new notation from twitter bootstrap 3+ - every icon can be defined with 2 CSS classes.
- Don't forget to setup proper mime types for font file.
- If you place fonts on separate domain, make sure, that server responds with proper CORS headers.
- In the html for your page add
<i class="CLASSNAME"></i>to show the font. CLASSNAME would be something like "icon-search" for your search icon. You can look in the css file to see the names of all of your icons.
Separate domains + no CORS headers
That's a bad situation. Try to avoid it if possible. But if you can't - embed fonts directly into CSS. See example in
Look at problems checklist