How to use custom font in css or in website

How to use custom font in css or in website

Website user interface has a major role in frontend interaction . Web designer Styling the website page by writing styles and save in a file with extension CSS . CSS is the short form of  Cascade Style Sheet.

For making web page more interesting designers using external  fonts. They use the css rule @font-face for adding custom font.


1.Download the font from the trusted source.

2.Put the font in a folder named fonts outside of the css file and note the path.

3.Use the css rule @font-face for add custom font.

Example CSS Code for add custom font
@font-face {
font-family: 'flexobold';
src: url("fonts/flexo-bold-webfont.eot");
src: url("fonts/flexo-bold-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/flexo-bold-webfont.woff2") format("woff2"), url("fonts/flexo-bold-webfont.woff") format("woff"), url("fonts/flexo-bold-webfont.ttf") format("truetype"), url("fonts/flexo-bold-webfont.svg#flexobold") format("svg");
font-weight: normal;
font-style: normal; }

The @font-face css rule permits custom textual styles to be include on a website page.

Related Search Terms

How to add custom font in css,
include custom font css,
custom font css3,


Leave a Reply