10

アイコンフォントが便利でしょうがない。過去に、Font Awesomeをphotoshopで簡単に使う方法をまとめたんだけど、ほかのフォントはチートシート(コピペできる一覧ページ)ないけどどうするの?的な質問があったのでまとめておきます。

  1. photoshopでアイコンを多用するデザインを作る人。
  2. 指定のwebフォント(アイコンフォント)を利用しなけれないけない。てか使いたい。
  3. アイコンは一覧から選ばないと量が多くてわかんなくなる。

みたいな人におすすめです。

環境:mac OS10.9.2 / photoshop CC
試したWEBフォント:Elusive Icons


1、Elusive Iconsのセットを、GitHubからダウンロード

00

2、ダウンロードファイルからmacにフォントをインストール。

01

02

3、するとFont Bookに、一覧が表示される

03

実は、このFont Book内の一覧から、必要なアイコンがコピペできるのです。
が、このままでは一部しか表示されてないのですよね〜。

4、FontBookで、全部のアイコンを表示させる。

04

5、全部のアイコン表示されたー!と喜ぶ。

05

ここからが、photoshopへのコピー作業

5、使いたいアイコンを選んでコピー。

06

6、photoshop上でテキストツールを選択してペースト。

07

7、フォントを、Elusive Iconsに指定で完成!

08

あれ、これってほかのアイコンフォントでもできるんじゃね?とお思いの方。
えぇ、できますとも。アイコンフォントをまとめておくと便利!

おまけ

10


以上、知ってしまえば簡単でしたね。めったに使わないFont Bookをたまには活用してあげてください。
それでは、よりよいアイコンフォントライフ。

Font Awesomeをphotoshopで簡単に使う方法はこちら

page
1 / 1