Web And Graphic Design Blog

How to use Google Fonts : how to download and use google fonts on PC

Google Fonts according to me is the best thing ever that could happen. Really I mean they are amazing and on top of it they are FREE.


Google fonts provides a large collection of fonts on https://fonts.google.com/  Any design project be it web or graphic need to have good typography. Typography is an important element of design. It makes your design beautiful and professional. Hence it is crucial to choose your fonts wisely. There are hundreds and thousands of fonts but not all can be used in any design project. Every project has a nature of its own and so do fonts. Font have to selected according to nature of the project. Google provides open source designer web fonts that can be used in any design project no matter where you are.

In this tutorial you will learn:
  • How to download google fonts on pc
  • How to install google fonts on pc
Let's see how to download and use google fonts,

1) Open up https://fonts.google.com/ in your browser.
You will see all the fonts listed.
You can customize the interface if you are sure of what you want.
The right side column allows you to narrow down the listings to serifs, sans serif, display, handwriting or monospace.
You can also sort the fonts as per trending, Popular, Date added or in alphabetical order. Best part is you can also choose the language you want. Google fonts are also available in many languages.
Sliders allows you to see the fonts according to style, thickness, slant or width that you set.


2) Choose the font you like. Once you decide to select the font click on the + icon in the upper right corner.

  The font will get listed in the Family selected tab in the bottom right corner of the window.




3) Copy the link in the family selected tab and head over to your html file.

Place the code between your head tag.





4) Go back to browser and copy the second link and head back over to your CSS file.


Paste the link where you want to use the font.





By default only the regular font is added to the script. If you want more styles you need to click on customize and select the styles you need. Click on the styles you want and the code will get updated then go ahead and copy the link as explained above.



Remember don't add all the styles. Use only the ones you need as it will increase the load time. In this example since only one style was selected the load time is fast. As you go on adding more styles you will see that the load time increases.


You can also download the font and use on your PC. Just click on the download icon in the Family selected tab and it will get downloaded to your PC. Install the font like any other font.




So that's all it is to using Google Fonts and install google fonts windows. As simple as eating a cake. Use them to make your websites beautiful and professional.


Practice and play around with these Fonts and 1 day you will be able to create awesome art with it in a professional manner and become a Really Creative Graphic Designer.

Don't forget to share your art with me and follow me on Twitter and Pinterest

If you like my tutorials and posts follow me on Twitter and Pinterest