How to add custom fonts using css

This is quick tutorial about How to add custom fonts using css, There is limited font available on web, But if you need more stylish font for your website then you can download custom fonts from the internet, Lot’s of website’s are proving free and paid fonts, There custom fonts makes your website more fancy and stylish.
fancy-font-css
Fist you need to download custom fonts from any website like
* http://www.1001freefonts.com/
* http://www.dafont.com/
* http://www.fontspace.com/popular/fonts
You can search more websites for fancy fonts on google.



Finally use following css code to add downloaded font. you can use a custom font using @font-face in your CSS. Here’s a very basic example:

@font-face {
    font-family: 'YourFontName'; /* Your custom font name*/
    src: url('http://example.com/fonts/newfont.ttf'); /* URL to font */
}

Now you can easily assign newly added font in your page by class and id.

.className {
    font-family: 'YourFontName';
}
#idName {
    font-family: 'YourFontName';
}

See live demo and download sample source code.

DEMO

DOWNLOAD


Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.