フリーで使えるWEBフォント【Googleフォント】の使い方

2020年10月29日

おはようございます。はんざきです。

今回はWEBデザインでほぼ必須なWEBフォントで、特に有名なGoogleフォントの使い方を解説していきます

WEBフォントを使えばどんなデバイスでも同じ表示をしてくれるので、WEBデザインフォントの統一化を図れます

Googleフォントの使い方

まずは、公式サイトにアクセスしましょう

GoogleFonts

フォントの一覧がカード状に表示されるので、使いたいフォントをクリックします

フォントスタイルの一覧が表示されるので、使いたいスタイルのフォントの右側にある【+】マークをクリックして追加します

【Embed】に追加したフォントが含まれたcssのソースリンクが表示されますので

それぞれの、htmlとcssに該当コードを挿入します

これだけでGoogleフォントを追加することができました。

WEBフォントを使えるようになると、WEBデザインの幅が広がるので是非使っていきましょう