Figmaで使える日本語フリーフォント一覧。商用利用も無料。 / メモ / いがわ

Figmaで使える日本語フリーフォント一覧。商用利用も無料。

2024.06.03 2025.10.09更新。

Contents - 目次

1 Figmaで日本語フォントが無料で。おすすめな33選。
2 Figmaで日本語無料フォントを使うためには。
3 Google Fontsの日本語フォント。
4 フリーフォントの栞の日本語フォント。
5 Figma 関連メモ。

Figmaで日本語フォントが無料で。おすすめな33選。

無料で商用利用も可能な日本語フォント。

日本語フォントのまとめ。

Figmaで使える無料の日本語フォントがまとめられている。

50種類あり、商用利用も可。

（※細かな利用条件は各フォントの公式サイトでチェック。）

Figmaで使える日本語フォント集。Free Japanese Fonts。

参照：無料で商用利用も可！日本語フォント集 50選 / 50+ Free Japanese Fonts | Figma
by ken

Figmaで日本語無料フォントを使うためには。

Figmaコミュニティから、Figmaで開く。

日本語フォント。

Figmaでファイルを開くと、それぞれのフォントで見本が作られている。

気になったフォントをクリックすると、左側のパネルのレイヤー名でそのフォント名が、右側のパネルのテキストでもそのフォントが表示される。

Figmaで使える日本語フォントの画像。

例えば、「うつくし」で検索すると、下記のように「うつくし明朝体」表示される。

Figmaで使える日本語フォントの画像。

フォントの太さの調整。

うつくし明朝のようにフォントの太さ（fontのweight）が調整できないタイプもある。

そのようなフォントは、ちょっと細いかなと思った場合に、「塗り」と同じ色の「線」を1pxや0.5pxなどにすると太くできる。

フォントがインストールされていない場合。

パソコンにフォントがインストールされていない場合は、右側のパネルのテキストの箇所で、フォント名の左側に「A？」の表示がされる。

その場合はフォント名で検索し、公式サイトなどからダウンロードすると良い。

Figmaで使える日本語フォントの画像。

日本語フォントの一覧。

Free Japanese Fonts（暫定）

Figmaで開くと、作者の方により、ジャンル別に分けられている。

Simple

Noto Sans JP
M PLUS 1p
Zen Kaku Gothic New
IBM Plex Sans JP
Kiwi Maru
スマートフォントUI
LINE Seed JP
木漏れ日ゴシック

Design

RocknRoll One
Kaisei Opti
Rampart One
Train One
HachiMaru Pop
851チカラヨワク
マキナス4
廻想体ネクストユーピー（B）
ロンドB
せのびゴシック
バナナスリップ
しろくまフォント

Hand Written

Yomogi
Zen Kurenaido
からかぜ
アオハルマーカー
夜すがらフォント
ふて寝フォント
851マカポップ
851手書き雑フォント
マメロン
無心
うずらフォント
あんずもじ
なごみ極細ゴシック
アームド・レモン

Thick

Dela Gothic One
851ゴチカクット
851レトロゴ
Mochiya Pop One
Potta One
851チカラヅヨク
コーポレート・ロゴ
キルゴU
ラノベPOP
ニコモジ＋

Rounded

M PLUS Rounded 1c
Zen Maru Gothic
コーポレート・ロゴ（ラウンド）
源柔ゴシック
AFSリモーネ

Mincho

Noto Serif JP
しっぽり明朝
Zen Antique Soft
コーポレート明朝 ver2
うつくし明朝

Font Viewer

パソコンにフォントが入っているかどうか。

フォントは、Figmaのプラグイン「Font Viewer」で調べることもできる。

Figmaのプラグイン「Font Viewer」の画像。

参照：Font Viewer
by KRAD

日本語フォントが利用できない場合も。

フォントは、環境や場合によっては利用できない可能性もある。

フォント名をコピペして検索し、公式サイトで確認をするのが基本かつ無難。

Google Fontsの日本語フォント。

Japanese fonts from Google Fonts

Google Fontsにあるものは、基本的に無料で商用利用可能。

Google Fontsにある日本語フォント一覧画面のスクショ。

参照：Browse Fonts – Google Fonts

GitHub Pagesの日本語フォント（Google Fontsから）。

Google Fonts + Japanese • Google Fonts + 日本語

GitHubにも、Google Fontsがアップされている。

フォントを選択すると、画面左側にHTMLとCSSのコードが表示されるので、HTMLファイルのmetaタグの中と、CSSファイルの中にコピペすると使用できる。

Google Fonts + Japanese • Google Fonts + 日本語のサイトのスクショ。

参照：Google Fonts + Japanese • Google Fonts + 日本語

Webデザインで日本語フォントを使用する際の注意点。

Webフォントの読み込み速度。

Webサイトで日本語フォントを使用する場合は、読み込み速度が遅くなるというデメリットがある。

WebフォントとしてGoogle Fontsから使用するのは簡単だが、日本語は英語のアルファベットなどと比べ数が非常に多いので、フォントを読み込むための時間がかかる。

なので、それを考慮・対策をして使う必要がある。

Webフォント高速化のための対処例。

<link rel="preconnect" href="https://xxxxx.com">の指定。
<link rel="preload" href="https://xxxxx/xxxxx.woff" as="font">の指定。

（※xxxxxの部分はフォントや環境に合わせて記述。）

font-display: swap;の指定。
フォントのサブセット化。（使用する文字を限定する。）
フォントウェイトの限定。（使用しない太さは読み込まない。）

など。

フリーフォントの栞の日本語フォント。

フリーフォントの栞

日本語のフリーフォントを探すなら。

「フリーフォントの栞」のサイトでは日本語の無料フォントを見やすくまとめてくれている。

こちらもおすすめなサイト。

フリーフォントの栞 – 無料で使える日本語フォントのスクショ。

参照：フリーフォントの栞 – 無料で使える日本語フォントをもっと見つけやすく

フリーフォントの栞でのよくある質問。

フォントライセンスの問い合わせは、各配布サイト（フォント配布の公式サイト）へ。

フリーフォントの栞のサイトのフォントライセンスについての質問と回答の画面。

無料で商用利用も可能な日本語フォントはありがたいもの。

日本語フォント一覧。おすすめ無料を眺める猫ちゃん。

以上、参考になれば幸いです。

※Webデザインは実務数年、職業訓練校講師数年、フリーランス数年、計15年以上のキャリアがありますが、一気にがぁっと書いているので「です・ます調」ではありません。（元々はメモ書きでした。） ※事実や経験、調査や検証を基にしていますが、万一なにかしら不備・不足などがありましたらすみません。お知らせいただければ訂正いたします。 ※写真は主にUnsplashやPixabayのフリー素材を利用させていただいております。その他の写真や動画もフリー素材やパブリックドメイン、もしくは自前のものを使用しております。

井川宜久 / Norihisa Igawa

Figma 関連メモ。

使い方 & プラグインなど。

FigmaでLiquid Glassデザイン。プラグインとエフェクト機能について。