Blog スタッフブログ
WEB制作
デザイン
【デザイン参考】Webデザイン時に良いなと感じたGoogle Fonts24選【備忘録】
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_eyecatchimg-1024x538.jpg)
こんにちは、デザイナーのMです。
Webデザイン作業において、フォントの選択は非常に大きな意味を持ちます。
それ一つでデザインクオリティが左右されると言っても過言ではありません。
今回はWebデザイン時に使用していて、個人的に「良いな」と感じたGoogle Fontsを一覧で紹介していきます。
Google Fontsは量が膨大なので、どれを使ったらいいかついつい迷ってしまいがちです。
主観に満ちた備忘録ですが、一つの参考にして頂けましたら幸いです。
・Noto Sans Japanese
・Noto Serif Japanese
・M PLUS Rounded 1c
ちなみにこの3つのフォントは個人的に過労死するレベルで使っている殿堂入りのフォントになりますので、以下のまとめには入っていません。悪しからずご了承ください。
では、さっそく見ていきましょう。
※記事は2022年8月現在の内容になります。
日本語フォント
■ゴシック体
BIZ UDPGothic
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img01.jpg)
Kosugi
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img02_s.jpg)
■丸ゴシック体
Kosugi Maru
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img02.jpg)
Kiwi Maru
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img04.jpg)
Zen Maru Gothic
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img05.jpg)
■明朝体
Zen Old Mincho
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img06.jpg)
BIZ UDPMincho
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img07.jpg)
Shippori Mincho
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img08.jpg)
■欧⽂フォント
Overpass
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img09.jpg)
ちなみにMIXのホームページにも使われています。
Roboto
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img10.jpg)
Open Sans
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img11.jpg)
Lato
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img12.jpg)
Oswald
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img13.jpg)
Nunito
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img14.jpg)
Quicksand
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img15.jpg)
Lora
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img16.jpg)
Poppins
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img17.jpg)
Montserrat
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img18.jpg)
Raleway
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img19.jpg)
Barlow Condensed
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img20.jpg)
Vollkorn
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img21.jpg)
Rock Salt
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img22.jpg)
Courgette
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img23.jpg)
Itim
![](https://mixltd.jp/cms/wp-content/uploads/20220810_osusumegoogle-fonts_img24.jpg)
いかがでしたでしょうか。
Google Fontsは膨大な量がありますが、今回は私が実際にWebデザインで使用した際、個人的に「いいな」と感じたフォントに絞ってまとめてみました。
それぞれ個性や特徴がハッキリしているので、シンプル、可愛い、クールなど、合うデザインテイストで使ってみてください。
当記事が少しでも制作時の参考になれば幸いです。