フォントをダウンロードしてフォトショやXDで使う方法

2022/05/04

WEBデザイン

t f B! P L

フォントをダウンロードして、PC内のソフト(フォトショップ、XDなど)で使うにはどうすればよいのでしょうか。

今回はグーグルフォントでダウンロードしたフォントをXDで使ってみたいと思います。

フォントをPC内で使用するには?

  1. フォントをダウンロードする
  2. ファイルを展開する
  3. インストールをする

手順はこんな感じです。以下でそれぞれ見ていきましょう。

フォントをダウンロードする


まずはフォントをダウンロードします。WEB上で使う際にはHTMLにリンクを貼るだけで使うことができるのですが、自分のPCのソフトでそのフォントを使いたい時にはダウンロードをする必要があります。

ダウンロードできるフォントであればなんでも同じ構いませんが、今回はよく使われる Google Fonts からダウンロードしてみましょう。

まずはトップページから好きなフォントを選んでクリックしてください。そのフォントのページに進むと右上に「Download Family」というボタンがあるのでそれをクリックしてみましょう。

Download Family とは、文字の太さのパターンすべてをダウンロードするということになります。個別にダウンロードすると文字の太さを変えることができないので、ファミリーごとまるっとダウンロードしたほうが良いでしょう。

ファイルを展開する


ダウンロードされたファイルは圧縮されたzipファイルです。このファイルをとりあえずわかりやすいところ、デスクトップにでも移動してください。

ダウンロードしたファイルがどこにあるのかわからないという人は、エクスプローラー(ファイルのアイコン)をクリックしてPCタブ内のダウンロードフォルダを見てみましょう。今ダウンロードしたzipファイルがあるはずです。

さて、ファイルを見つけて移動したら、ファイルの上で右クリックをして、「すべて展開」をクリックします。するとウインドウが開いて展開する場所をきかれるので、そのまま無視して「展開」をクリックします。

すると同じ名前のファイルがデスクトップに新しくできたと思います。そいつをクリックすると .ttf というファイルがあると思います。それがフォントのファイルです。

右クリックでインストールを選択


複数ある場合はすべての .ttf ファイルを選択した状態で右クリックをして「インストール」をクリックします。

これでご使用のPCにこのフォントがインストールされました。フォントを選択できるタイプのソフトすべてで、今回インストールしたフォントが使えるようになっているはずです。

試しに Adobe のソフトで確認してみましょう。ちゃんと反映されているはずです。


余談ですが、.ttf とはどのようなファイルなのでしょうか。IT用語辞典からの引用です。

TrueTypeフォント / TrueType font

TrueTypeとは、サイズに依らずきれいに表示・印刷できるアウトラインフォントのデータ形式の一つ。 データファイルの標準の拡張子は「.ttf」および「.ttc」。

まとめ:フォントをダウンロードして使うには?


ということで、フォントを使うには以下の手順で行いました。

  1. ダウンロード
  2. ファイルを展開
  3. インストール

Google Fonts にあるフォントをWebサイトで使うときはHTMLにリンクを貼るだけでよいのですが、ローカルのソフトでフォントを使用する際にはインストールをしないと使うことができないので、こういった作業が必要になります。

たくさんインストールしてもPCが重たくなるということもないので、とりあえず気になるフォントがあればダウンロードしておくのもおすすめです。

QooQ