Studioで利用できるフォント一覧｜変更・追加する手順も解説

ノーコードWeb制作ツール「Studio」では、Webフォント・システムフォント・カスタムフォントの3種類を使い分けることができます。

サイトの表示速度を優先するならシステムフォント、デザインの統一性を保つならWebフォント、独自のブランド表現を追求するならカスタムフォントが最適です。

本記事では、各フォントの特徴や2025年の人気フォントランキング、具体的な設定手順を詳しく解説します。

Studioで使用できるフォント一覧

Studioで使用できるフォントは、下記3つになります。

フォント名	特徴
Webフォント	閲覧者の環境を問わず、制作者の意図通りのデザインが表示される。読み込みに時間がかかり、わずかに表示が遅れる場合がある。
システムフォント	読み込み不要で表示が最も速い。OSに最適化されており読みやすい。閲覧環境（MacかWindowsか等）によって、見た目が変わってしまう。
カスタムフォント	独自のブランドフォントや有料フォントが使用可能で個性を出しやすい。ファイルサイズが大きいと表示が重くなる。

スピード重視ならシステムフォント、デザイン重視ならWebフォント or カスタムフォントというイメージになります。

それぞれ具体的に説明します。

参考：フォント選びと使い分けのヒント：システムフォント（System Font）とWebフォント

①：Webフォント

Webフォントは、すべての閲覧環境で同じフォントを表示することができます。

Studioでは3種類のWebフォントが使えます。

Webフォント名	特徴
Google Fonts	完全無料のオープンソース。Noto Sansなど多言語対応が手厚く、軽量で世界標準。
TypeSquare	株式会社モリサワが提供するWebフォントサービス。ビジネスや高級感に強い「新ゴ」や「A1ゴシック」などプロ仕様の日本語書体が豊富。
FONTPLUS	筑紫書体などデザイン性の高い和文が充実。表示速度の高速化技術に優れ、プロの制作現場で愛用されている。

Webフォントは読み込みに時間がかかり、わずかに表示が遅れる可能性がかかりますが、デザイン性の高いデザインを実現できます。

会社の看板となるコーポレートサイトやブランドサイトなど、洗練されたデザインを実現したい時はWebフォントを選ぶのがおすすめです。

②：システムフォント

システムフォントは、閲覧しているユーザーのPCやスマートフォンにあらかじめインストールされている書体を使ってテキストを表示する方法です。

外部からフォントデータを読み込む必要がないため、Webサイトの表示速度を極限まで高めることができます。

Webフォント名	主なフォント例	特徴
Windows	游ゴシック、メイリオ	ビジネス文書でも馴染み深く、視認性に優れる。
macOS / iOS	ヒラギノ角ゴ、San Francisco	洗練された印象で、高精細なディスプレイで見映えが良い。
Android	Roboto、Noto Sans CJK JP	Googleが開発したモダンな書体。スマホ環境に最適化。

デメリットとしては、閲覧環境で見た目が変わることが挙げられます。

③：カスタムフォント

カスタムフォントは、自分が所有しているフォントデータを直接アップロードして表示させる方法です。

特定のブランド専用に作られたコーポレートフォントや、Webフォントサービスでは配信されていない希少なデザイナーズフォントを使いたい場合に最適です。

世界観を表現するのにカスタムフォントは最適ですが、日本語フォントはファイルサイズが大きいため、読み込み速度に影響が出やすいです。

SEOをより強化したい場合、サイトの表示スピードが大きく影響してくるので、カスタムフォントには注意するようにしましょう。

Studioの人気フォントランキング

Studioはこれまで20万以上のサイトが作られており、コーポレートサイトやサービスサイト、採用サイトなど多岐にわたります。

この章では、Studioで選ばれた人気フォントランキングを紹介します。

2025年の人気ランキング

順位	フォント	フォントサービス名
1位	Noto Sans JP	Google Fonts
2位	Inter	Google Fonts
3位	Montserrat	Google Fonts
4位	A1ゴシック M JIS2004	TypeSquare
5位	A1ゴシック R JIS2004	TypeSquare
6位	Poppins	Google Fonts
7位	Roboto	Google Fonts
8位	Rubik	Google Fonts
9位	ヒラギノ角ゴ W3 JIS2004	TypeSquare
10位	Libre Baskerville	Google Fonts

上位を占めるNoto Sans JPやInterは、PC・スマホを問わず高い視認性を誇るフォントの代表格です。特に、1位のNoto Sans JPは、日本語と英語が混在してもバランスが崩れない汎用性から、現在のWebデザインにおける「標準」といえる地位を築いています。

また、A1ゴシックやヒラギノ角ゴといったTypeSquare（モリサワ）系のフォントがランクインしています。これらは「高級感」を演出したいビジネスサイトで重宝されており、一歩先のデザインクオリティを求めるユーザーに支持されています。

欧文フォントでは、MontserratやPoppinsなど、クリーンな印象を与える「ジオメトリック・サンセリフ」が人気です。これらはスタートアップ企業のような先進的なイメージや、親しみやすさを表現するのに最適です。

Studioで利用されているフォントをより詳しく知りたい方は、以下の記事もご覧ください。

2024年の人気ランキング

順位	フォント	フォントサービス名
1位	Noto Sans JP	Google Fonts
2位	Montserrat	Google Fonts
3位	A1ゴシック M / R JIS2004	TypeSquare
4位	Roboto	Google Fonts
5位	Inter	Google Fonts

2025年にトップ10にランクインしているフォントが全て占めています。

2024年と2025年の2年間は、「機能性」と「表現力」を重視したフォントが選ばれています。

また2024年はGoogle Fontsが選ばれることが多かったですが、2025年になってTypeSquare（モリサワ）が選ばれることが多くなっており、徐々に日本語書体の存在感も増してきています。

Studioでフォントを変更・追加する手順

次に、Studioでフォントを変更・追加する手順について解説します。

• Studioでフォントを変更する方法
• Studioでフォントを追加する方法

それぞれ具体的に説明します。

フォントの変更方法（Webフォント・システムフォント）

フォントを追加する手順（カスタムフォント）

参考：カスタムフォント（Custom Fonts） | Studio Help

Studioでのサイト制作は「Terace」にお任せ！