Using a different font with twitter bootstrap

Question

I want to use a different font for my website, which is not a regular webfont. I have created EOT files already. Now how can I integrate those fonts with twitter bootstrap ?

Answer 1

You can find a customizer on the official website, which allows you to set some LESS variables, as @font-family-base. Link your custom fonts in your layout, and use your custom generated bootstrap style.

Link here

For an example with the @font-face rule, using WOFF format (which is pretty good for browser compatibility), add this CSS in your app.css file and include your custom boostrap.css file.

@font-face {
  font-family: 'Proxima Nova';
  font-style:  normal;
  font-weight: 400;
  src: url(link-to-proxima-nova-font.woff) format('woff');
}

Please note Proxima Nova is under a license.