LoginSignup
20
7

More than 5 years have passed since last update.

FigmaでFont Awesomeを使えばいいことが待っている、きっと……

Posted at

Figmaを触ってて、アイコン使いたいな〜っと思ってたら
Font Awesomeが簡単に使えるとのこと。
早速使ってみました。

※本記事の内容はFigmaの公式ドキュメントに既に書かれております(英語)
https://help.figma.com/article/250-working-with-fonts#icon

1. Font Awesomeにてアイコンをコピー

  • チートシートからコピー スクリーンショット 2019-01-23 7.08.51.png
  • またはアイコンの詳細からコピー スクリーンショット 2019-01-23 7.08.59.png

2. Figmaにてコピーしたアイコンを貼り付け、フォントを「Font Awesome 5 free」に設定

どこでもいいのでFigma上でコピーしたアイコンを commnad + v で貼り付けます。
するとTextが置かれますが、まだアイコンは表示されていません。
スクリーンショット 2019-01-23 7.39.00.png

フォントを「Font Awesome 5 Free」へ変更すると表示されます。
FIgmaFontAwesome.gif

以上です!!!

おまけ. アイコンを大きくしたいときはフォントサイズをいじります。

IconSize.gif
大きくなって強そうにみえますね。


タイトルはこちらから自動生成しました。
http://www.copymecha.com/index.php

20
7
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
20
7