Font AwesomeのアイコンフォントをPhotoshopで使う方法

2016年11月06日
follow us in feedly

PhotoshopでWEBデザインするときにFont Awesomeのアイコンフォント使うなら、エクステンションのFont Awesome PSが便利です。

fontawesomeps

便利ですが、まだバージョン4.7で追加されたアイコンフォントが反映されていません。そこで、Font Awesomeの最新版をPhotoshopで使う方法をまとめます。

Font Awesomeの最新版アイコンフォントをPhotoshopで使う手順

はじめにFont AwesomeのアイコンフォントをPCにインストールする

Font Awesomeのトップページにある「Download」をクリックします。

font_awesome1

現れたモーダルウィンドウの「No thanks,just download Font Awesome」からファイルをダウンロードします。

font-awesome2

ダウンロードされたzipファイルを解凍して、fontsフォルダにある「FontAwesome.otf」を自分のPCにインストールします。

私はMacユーザなので、Font Bookアプリケーションを使ってサクッと完了。

fontbook

そしてチートシートを利用する

Font Awesomeにはチートシートが用意されていますので、そこから使いたいフォントを選択してコピーします。

cheatsheet_1

Photoshopを起動して、テキストツールを選択した状態でペーストします。

img_photoshop_1

文字化けしていますので、フォントの種類を「FONT AWESOME」に変更すればOKです。

img_photoshop2_1

以上で終わり!

follow us in feedly

関連記事

福岡でホームページ制作を依頼するなら【ハブワークス】

ホームページ制作・リニューアル・スマートフォンサイト制作・ECサイト制作は福岡のハブワークスまでお気軽にどうぞ。WEBサイト制作後の修正・更新・SEO対策もお任せください。リーズナブルな料金設定でサービスをご提供いたします。

webサイト制作・修正に関するお問合せ・ご相談・お見積りはお気軽にどうぞ