Using Google fonts on your website is quite easy. You can start using Google fonts on your website in few easy steps.
-
Open Google Fonts website on your browser from this URL
https://fonts.google.com/. The website will look like below picture.
-
Now go to the search box & search for the specific font you want to apply
on your website. You will notice, as you start typing in the search box, results will start getting filtered.
-
Now click on the plus icon on the top right corner of your font.
-
Once you click on the plus icon, you will see a black bar starts
appearing at the bottom.
-
Once you click on this bar, a window will open like below.
-
Now you need to do two small things to embed this font on your
website. First, copy below code & paste it in the head section of your web-page.
Copy it like below in your HTML page.
-
Now copy below CSS code & assign this CSS to the body part of your
application.
Now apply this CSS on the body part of your web-page like below.
Note: Here I have used on-page CSS. Ideally, you should place CSS code in a separate CSS file.
8. Now, open this index.html page in the browser. This page will look
like below page.
Congratulations..!! You have successfully implemented Google fonts on your website.