What Are The Default And Web Fonts of Blogger Platform?

Know what are the Default and Web Fonts integrated with Google Blogger Platform? A guide to finding the best free website fonts via Google Blogger.
Blogger font lists

The font is the main thing to write and design the text on a website. There are huge fonts available over the net, but all of them are not usable. Every font has some unique feature and shape. Suppose Arial The font has different looks and variants. It can be written with Regular, Bold and Italic style but Impact font can be write in Regular format. So it has only one variant.  

We already well acquainted with almost all major Blogging platforms like Blogger, WordPress, Drupal, Weebly, Ghost and you will see all Blogging platform has integrated own Font directory. This will help to load Font while opening a Website in a non-supported browser. For example, you are using Arimo font in your Website but in your site’s visitors, PC hasn’t installed that font then your site will look odd with unknown Fonts. So by integrating and hosting fonts in your own Blogging platform it is helping the site owner to run it smoothly.

The most popular Blogging platform is Google Blogger. Formerly we have seen there are few fonts were integrated with it. But after the rapid refurbishment of the Blogger platform now they have integrated 91 Fonts for their blogging platform users. This is really good news for existing and potential Blogger platform users.  However, we can classify the whole Fonts into 2 categories.
  • Default Font
  • Web Font

What is the Default Font?

Default Font are those which is generic Font and available in almost all Operating system and support all types of browsers. Default fonts are very lightweight to load so when a website uses the default font then that website run fast.

What are the Default Fonts Google Blogger uses?

There are only 7 default Font are available in Google Blogger which can be used directly on the Blogger template. And it is very lightweight. And your site won’t feel any burden to load it with your Blogger template.
  1. Arial
  2. Courier
  3. Georgia
  4. Impact
  5. Times New Roman
  6. Trebuchet
  7. Verdana
Besides this, we can use some other Font like Tahoma, Helvetica, FreeSans, sans-serif which is also available almost on all operating system. And it will load faster without affecting site loading speed.

What is Web Font?

Web Font is generally loaded from the Google server. Those are hosted on the Google Font server. And if you use those web fonts then every time those fonts load from the Google server and at the source code of your Blog it generates a CSS file to load the font perfectly.  But it is not visible all the time.

What are the Web Fonts Google Blogger uses?

Google Blogger included almost all popular Web Fonts in the Blogger platform. You can use those in Blogger default and a custom template. There are altogether 84 web fonts integrated with the Blogger platform. However, if you wish to use a different font then you can use it from the Google Font library. But you have to add a Font CSS file in your Blogger template.
  1. Allerta
  2. Allerta Stencil
  3. Arimo
  4. Arvo
  5. Bentham
  6. Calibri
  7. Calligraffitti
  8. Cambria
  9. Cantarell
  10. Cardo
  11. Cherry Cream Soda
  12. Chewy
  13. Coming Soon
  14. Consolas
  15. Copse
  16. Corsivo
  17. Covered by Your Grace
  18. Crafty Girls
  19. Crimson Text
  20. Crushed
  21. Cuprum
  22. Dancing Script
  23. Droid Sans
  24. Droid Sans Mono
  25. Droid Serif
  26. Fontdiner Swanky
  27. GFS Didot
  28. GFS Neohellenic
  29. GEO
  30. Gruppo
  31. Hanuman
  32. Homemade Apple
  33. IM Fell DW pica
  34. IM Fell DW pica SC
  35. IM Fell Double Pica
  36. IM Fell Double Pica SC
  37. IM Fell English
  38. IM Fell English SC
  39. IM Fell French Canon
  40. IM Fell French Canon SC
  41. IM Fell Great Primer
  42. IM Fell Great PRIMER SC
  43. Inconsolata
  44. Indie Flower
  45. Josefin Sans
  46. Josefin Slab
  47. Just Another Hand
  48. Kenia
  49. Kranky
  50. Lobster
  51. Luckiest Guy
  52. Merriweather
  53. Molengo
  54. Mountain of Christmas
  55. Neucha
  56. Neuton
  57. Nobile
  58. Old Standard TT
  59. Open Sans
  60. Oswald
  61. PT Sans
  62. PT Sans Caption
  63. PT Sans Narrow
  64. Pacific
  65. Paytone One
  66. Permanent Marker
  67. Philosopher
  68. Play
  69. Puritan
  70. Reenie Beanie
  71. Roboto
  72. Rock Salt
  73. Schoolbell
  74. Slackey
  75. Sorts Mill Goudy
  76. Sue Ellen Francisco
  77. Sunshiney
  78. Syncopate
  79. Tinos
  80. UnifrakturMaguntia
  81. Unkempt
  82. Vollkorn
  83. Walter Turncoat
  84. Yanone Kaffeesatz
Among 94 web fonts, there are some popular fonts are widely using in template designing. Such as
  1. Droid Sans
  2. Open Sans
  3. Oswald
  4. PT Sans
  5. Roboto
  6. Yanone Kaffeesatz
The above Fonts are using for heading font in websites.

How to use Fonts Directly on Blogger Default Template?

This is very easy to use Google font in the default template. Even in many custom templates now it is supporting automatically.

Step 1 Log in to your Blogger Account and Go to your Blogger Dashboard

Step 2 Click on -> Template -> Customize->


template customization

Step 3 Now Blogger Template Designer option will open. And from there select Advanced Tab -> Main Font. This option may come differently in your Blogger template. 


Blogger template designer

Step 4 Under the main Font select your Heading Font, Blog Title Font, Blog Description Font, Page Text etc.

Step 5 Finally click Apply to Blog Button from the top right corner of the screen.

However, you can see changes according to your selected Font style. This feature can be used if the variable is defined in your Blogger template. But if you didn’t define any variable then do it manually but select the Fonts from the above lists. The example has given below-
.post{font-family:'Arial';overflow:hidden;font-size:13px;color:#555555;}
In the above example, I have used Arial font as font-family. You can use a different font. I hope you are now able to change your Blogger template font easily. After changing the font manually don’t forget to save your Blogger template.

That’s all about Google’s default and web fonts. I hope this tutorial will help you to select appropriate Font in your Blogger template. 

You may like these posts

8 Comments

  1. Unknown
    Thanks Sir .

    Sir Bloge Alert Box এর কাজ কি । আর আপনার bdarena.com সাইটে কি Alert Box আছে ।
    • BloggerSpice
      Text highlight kora. Bdarena te kono highlighter box nai. Use Alert Boxes from below URL.

      http://www.bloggerspice.com/2016/01/how-to-improve-Post-Engagement-by-using-custom-notification-boxes-in-blogger.html
  2. Unknown
    vai amar template tate apnar moto title a uppercase kore den plz
    • BloggerSpice
      Apnar site to check korlam shob uppercase kora.
  3. Unknown
    tahole vai uppercase show korena keno?
    • BloggerSpice
      Google chrome a check koren. Amar mone hoy apnar browser ar cache clean kora nai. oita clean koren pore check koren.
  4. Unknown
    Hi, i absolutely got tons of value from your post. Please i have 2 quick questions.
    1. What is the number of plugins every blogger shouldn’t exceed? I currently have about 18 installed, would you consider that number outrageous. Please could you also check out my site and offer me a
    2. Your font is really beautiful. would you suggest plugins that would give me beautiful fonts just like yours?
    Finally, would you spare a few seconds to check this site and offer me your candid advice http://www.samozoani.com
    • BloggerSpice
      Hi Enlights techpro :ey

      Too many plugins slow down your website, and crappy plugins may introduce errors that may cause your blog to become vulnerable to attacks. Here are the best 6 plugins that’ll absolutely rock your blog.

      1. Akismet
      2. Clean and Simple Contact Form
      3. Click To Tweet
      4. Related Posts
      5. Sumu
      6. Yoast SEO

      I am using 2 Google fonts. But you have to do little customization of your font. Just increase the lineheight of the font it will look great.

      1. Roboto Condense (For all Headline)
      2. Arimo (For content writing)

  1. To insert a code use <i rel="pre">code_here</i>
  2. To insert a quote use <b rel="quote">your_qoute</b>
  3. To insert a picture use <i rel="image">url_image_here</i>
Go Up