feat: add a post about google font

posts/how_to_use_google_font.md

@@ -0,0 +1,23 @@
+---
+title: How to use Google Font in Tailwind CSS
+published_at: 2024-11-15T15:00:00.000Z
+snippet: 3 steps to use Google Font in Tailwind CSS
+---
+
+## Why do we use Google Font?
+
+First of all, I'd like a better looking font for my website😂
+
+The benefits of using Google Font are:
+
+- **Performance**: Google Fonts are hosted on a fast, reliable CDN. They can be loaded faster than self-hosted fonts(for non-chinese users).
+
+- **Free**: Google Fonts are free to use.
+
+- **Variety**: Google Fonts has a wide variety of fonts to choose from, and I can easily find the font that suits my website, by typing the text I want to display in the font.
+
+## How to use Google Font in Tailwind CSS
+
+### Step 1: Find the font you like
+
+Go to [Google Fonts](https://fonts.google.com/) and find the font you like. For example, I choose [Roboto](https://fonts.google.com/specimen/Roboto).