
サイトのどこかしらには使うアイコン。さまざまなテイストのアイコンが提供されているので、迷いどころですよね…
アイコン配布サイトを見つけてはブックマークしているので、ここにまとめていきたいと思います。フリーで使える(有料で使えるアイコンや機能もある)ものをチョイスしています。
使いたいアイコン1個から選んでもいいし、有名どころだからということで選んでもいいと思います。
サイトのデザインに合っているかどうかは重要ポイントなので、全体のデザインに合っているかは要チェックです。
アイコンフォントは「フォント」として使うためどのデバイスでもきれいに表示され、スタイル変更やアニメーションもCSSで簡単にできます。
画像と併せてアイコンフォントを配布しているサイトもありますし、アイコンフォントのみで配布しているところもあります。アイコンをフォントとして使いたいかどうかによっても、アイコンを選ぶ決め手になるかと思います。
【関連記事】アイコンフォントを使うときに知っておきたい基礎知識
記載しているサイトのプランや金額などは変更している可能性もあるので、公式サイトで再度ご確認お願いします。(最終更新 : 2022/1/14)
Font Awesome
ご存知の方も多いはず。迷ったらこれ使っておけばOKくらいなFont Awesome。
プランは「Free」と「Standard」があります。
プラン | 費用 |
---|---|
Free | $0 |
Standard | $99 / per year(年間) |
無料でもメールアドレス登録が必要です。無料プランだと使えるアイコンが限られています(Standardプランの1/4以下のアイコンしか使用できません)
Font Awesomeでよりたくさんのアイコンを柔軟に使うなら有料プランの検討を。
IcoMoon
こちらもおなじみのアイコンサイト。テーマによって様々なテイストのアイコンがあるのでサイトにあったアイコンを選びやすい。
IcoMoonのプランは3つあります。
プラン | 費用 |
---|---|
Free Plan | $0 |
Basic Plan | $9 / 30 Days(1ヶ月) $19 / 90 Days(3ヶ月) $69 / 365 Days(1年) |
Unlimited Plan | $19 / 30 Days(1ヶ月) $69 / 90 Days(3ヶ月) $139 / 365 Days(1年) |
Zwicon
https://www.zwicon.com/cheatsheet.html
きれいな細めラインのアイコンです。
ダウンロードしてプロジェクトフォルダーに入れるだけで利用できる手軽さもうれしいところ。
WEGRAPHICS
WeGraphics はデザイナー向けのオンラインコミュニティ&グラフィックデザインリソースのマーケットプレイスです。
手書き系のアイコンを探していて、見つけたアイコンセットが WeGraphics にあってこのサイトを知りました。
https://we.graphics/item/handy-icons-webfont-kit/
他にもたくさんのアイコンがあります。
無料でダウンロードできるものもありますが、メンバーライセンスが必要なアイコンセットもあるので、気に入ったアイコンがライセンスが必要なものであれば登録しなければなりません。(メンバーライセンス取得は$20)
Fontello
アイコン名やアイコンのコードのカスタマイズもできるアイコンフォント。何のアイコンを使っているか把握しやすいのがうれしいところです。
フリー提供しているアイコンが一覧にあるので、好きなアイコンを選択してダウンロードするだけで利用できます。
EmojiSymbols Font
https://blockworks.jp/emoji/
表情豊かな顔アイコンが他にはないなーと思ってブックマークしたもの。絵文字なのでWebフォントとして利用します。(画像としては利用できない)
Free Vector Icons – GraphicSurf.com
カラフル&かわいい・きれいなアイコンが揃っているイラストアイコンポータルサイト。種類がとても豊富でここで探せば他にはなかったジャンルのものが見つかるかも。
Free Icons for Everything – Noun Project
500万ものアイコンをそろえているサイト。無料でも使えるけど帰属表記が必要なので有料で使う方が良さそう。
その他にもいいなと思ったサイト
シンプルで汎用的なアイコンだけを使いたいとき
提供しているアイコン数はそれほど多くなく、汎用的に使うアイコンは網羅しているため迷いにくくていい。
汎用的なアイコンだけでいいという場合はこれらのサイトを使うのもおすすめです。
- Typicon
- Genericons Neue
- Foundation Icon Fonts 3
- CONDENSE-iconFont
- The Elegant Icon Font
- WebHostingHub Glyphs
試しにアイコンを使いたいとき
https://weloveiconfonts.com/
メジャーなアイコンサイトまとめられていて、複数のアイコンフォントを選択して使えることができる。テストサイトやCodePen で使用できます。(通常運営するサイトはNG)
メジャーなアイコンサイトの一部アイコンを見比べるときに使ったりもします。
カテゴリー : Design