教え子さんに備忘録：おすすめ日本語フリーフォントと、figmaブラウザ版でフリーフォントを使う方法

デザイナー1年生の皆さん、こんにちは。デザイン事務所HOXAIの市角壮玄です。BBT大学経営学部デジタルビジネスデザイン学科准教授。各種企業自治体でデザインとデザイン思考を面白おかしく教えてますー！

今日は、おすすめ日本語フォントのご紹介と、ブラウザ版Figmaでローカルフォントを使う方法をシェア。講義内で必ず解説するので備忘録的に自分の記事においておこうと思います。

おすすめ人気フリー日本語フォント

まずはおすすめの人気フリー日本語フォントをいくつかご紹介。日本語のフォントで高品質な物は少ないので！

1. Noto Sans JP

   • Google提供のシンプルで読みやすいフリーフォント。

2. M PLUS Rounded 1c

   • 丸みを帯びたデザインが特徴のかわいらしいフォント。

3. Klee One

   • 手書き風のやさしい雰囲気が魅力。

4. Sawarabi Mincho

   • 伝統的な明朝体で、クラシックなデザインに最適。

5. XANO明朝

   • 美しく洗練されたラインが特徴の明朝体。印刷物やウェブデザインに最適。

6. Zen Antique

   • 古風で優雅なデザインが特徴。クラシックな雰囲気を演出します。

7. うつくし明朝体オールド

   • 手書き風の温かみを持ちながらも、洗練された美しい明朝体。

8. LINESEED

   • 柔らかい曲線とシャープなラインが調和したフォント。モダンなデザインにピッタリ。

9. MOBO

   • シンプルで読みやすいデザイン。多用途に使える汎用性の高いフォント。

ぜひ、これらのフォントを試してみて、あなたのデザインに新しい風を吹き込んでください。

figmaブラウザ版でフリーフォントを使う方法

1. Figma Font Installerのダウンロード

まずはじめに、Figmaのダウンロードページにアクセスします。ページの右下に「フォントインストーラー」がありますので、それをクリックしてダウンロードしましょう。以下のリンクから直接アクセスできます。

Figmaダウンロード | デスクトップ&モバイル向けWebデザインアプリ

2. フォントインストーラーのインストール

次に、ダウンロードした「Install FigmaAgent.dmg」をダブルクリックして開きます。以下の手順に従ってインストールを進めます。

1. 「Install Figma Agent」をダブルクリックして開きます。

2. ダウンロードするかどうかの警告文が表示されたら、「開く」をクリックします。

3. 最後に、インストール完了のメッセージが表示されるので、「OK」をクリックします。

これで、ブラウザ版Figmaでもローカルフォントが反映されるようになります。

3. ブラウザ版Figmaでのフォント利用

インストールが完了したら、ブラウザ版Figmaを開きましょう。新しいデザインプロジェクトを開始し、フォントリストにローカルフォントが表示されていることを確認してください。これで、あなたのデザインに個性を加える準備が整いましたね！

トラブルシューティング

もしローカルフォントが表示されない場合は、以下のポイントを確認しましょう：

• Figma Font Installerが正しくインストールされているか

• ブラウザを再起動する

• Figmaのキャッシュをクリアする

そもそもフォントのインストール方法がわからない？

そんな方はこちら。

Windowsでのフリーフォントのダウンロードとインストール方法

1. フォントサイトにアクセス
   お好みのフリーフォント配布サイトにアクセスします。以下のリンクからアクセスできます。

   • Google Fonts

   • Font Squirrel

2. フォントをダウンロード
   好きなフォントを選び、「Download」ボタンをクリックしてフォントファイル（通常はZIPファイル）をダウンロードします。

3. フォントファイルを解凍
   ダウンロードしたZIPファイルを右クリックし、「すべて展開」を選択してフォントファイルを解凍します。

4. フォントをインストール
   解凍したフォントファイル（.ttfまたは.otfファイル）を右クリックし、「インストール」を選択します。これでインストールが完了です。

Macでのフリーフォントのダウンロードとインストール方法

1. フォントサイトにアクセス
   お好みのフリーフォント配布サイトにアクセスします。以下のリンクからアクセスできます。

   • Google Fonts

   • Font Squirrel

2. フォントをダウンロード
   好きなフォントを選び、「Download」ボタンをクリックしてフォントファイル（通常はZIPファイル）をダウンロードします。

3. フォントファイルを解凍
   ダウンロードしたZIPファイルをダブルクリックしてフォントファイルを解凍します。

4. フォントをインストール
   解凍したフォントファイル（.ttfまたは.otfファイル）をダブルクリックします。フォントブックが開き、「フォントをインストール」ボタンをクリックします。これでインストールが完了です。

最後にちょっと自己紹介
わたくしのデザイナーとしての制作物はこちら。

HOXAI | デザイン事務所ホクサイ

その他、デザイン思考を活用した事業創造ワークショップやコンサルティングを請け負っております。

#デザイナーの頭の中 書いてます！
デザインについてのお話、他にもありますので興味があったら。

デザインのお話｜市角 壮玄 HOXAI　アートディレクター/デザイナー/BBT大学准教授/料理研究家/映像作家｜note