アイコン素材はWebデザインのあらゆる場所で活用することができます。ボタンやリストの見出し、ラベルなどにアイコン素材を取り入れれば、より使いやすくデザインも優れたWebサイトを作ることができますね。
しかし、自分でアイコン素材を作るのは手間がかかるし、アイコン素材を探す場合もライセンスなどを調べるのが結構面倒です。
そこで、今回は商用利用OKの無料で使えるおすすめのフリーアイコン素材サイトをまとめました。
※ライセンスについては記事公開後に変更される可能性もあるため、ダウンロード前にご自身でご確認ください。
アイコン素材を使用する時に気をつけるべきこと
無料で利用可能なアイコン素材だからといって、なんでもOKという訳ではありません。必ずライセンスルールを守ってアイコン素材を利用するようにしましょう。
著作権を守ろう
本記事でご紹介しているアイコン素材は、下記のポイントを中心にピックアップしました。
- アイコンの種類の豊富さ
- 無料で利用可能
- 商用利用OK
- 著作権表記が不要（一部必要なものも）
商用利用や著作権表記については、しっかりとルールを守らないとトラブルになってしまいます。必ず各サイトのライセンス情報を確認してから利用するようにしましょう。
基本的に再配布はNG
無料で利用することができ、著作権表記なしで利用できる場合でも著作権は配布サイトにあります。そのため、配布サイトの許可なしでダウンロードしたアイコン素材をWebサイト上などで配布すると、利用規約違反となってしまう可能性があります。
サイトによっては再配布をOKしている場合もあるので、気になる人は一度ライセンスをしっかりと読んでみましょう。
Webに表示するならSVG形式がおすすめ
アイコン素材には複数のファイル形式が提供されていますが、Webサイトに表示する場合はSVG形式で利用するのがおすすめです。
ファイルサイズを小さく抑えることができ、どんな大きさで表示しても粗くならないので画像サイズを気にする必要がありません。
おすすめのフリーイラスト素材サイト
Phosphor Icons
7,000種類以上のアイコン素材が配布されているサービス。
ストローク幅が変更できたりデュオトーンにも対応しているなど、用途に合わせてブラウザ上でスタイルを変更することが可能です。
Figmaのプラグインが公開されていたり、Webフレームワークにも対応しているなど、使い勝手にも優れています。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 必要（MITライセンス） |
| ファイル形式 |
|
SVG Repo
50万種類以上もの豊富なテイストのアイコン素材がコレクションごとに公開されているサイト。
リッチなアイコン素材がコレクションごとにまとめられていて、デザインの世界観に合わせてアイコンを用意したい場合におすすめです。
デュオトーンやマルチカラーのアイコンの種類が豊富な点も素晴らしいです。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 |
|
Boxicons
1,600種類以上のシンプルなアイコンが利用できるサービス。
PNGやSVGで画像ファイルとしてダウンロードできる他、WebコンポーネントやWebフォントとして利用することも可能です。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 必要（MITライセンス） |
| ファイル形式 |
|
Akar Icons
400種類以上の丸みを帯びた可愛らしいアイコン素材が配布されているサービス。
ブラウザ上でストローク幅やサイズを変更することが可能です。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 必要（MITライセンス） |
| ファイル形式 |
|
Fluent Emoji
Microsoftによってオープンソースとして公開された3Dで表現された絵文字素材。
Fluent DesignというMicrosoftが開発しているデザインシステムに合わせて作られている絵文字素材で、オープンソース化されたことによって、より幅広い形で使えるようになりました。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 |
|
3dicons
3Dで作られた素敵なアイコン素材を配布しているWebサイト。
120種類以上のアイコンのそれぞれについて、4つのスタイル、3つの角度で配布されていて、合計1440種類以上の素材を利用することができます。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 |
|
MingCute Icon
UIデザインで活躍しそうな1400種類用意されているアイコン素材。
SVGやPNGでダウンロードできるほか、フォントファイルとして利用することもできます。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 |
|
IconPark
IconParkは、TikTokなどを運営するByteDanceが提供するオープンソースのフリーアイコン素材サイトです。
テーマやサイズ、線の太さ、色、塗りつぶしの色などブラウザ上でカスタマイズして、アイコン素材をダウンロードすることができます。
ReactやVue向けのパッケージも用意されていて、簡単にインポートすることが可能です。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 | SVG, PNG, React, Vue |
IconStore
IconStoreは、著作権表記が不要で、商用利用もOKなアイコンパックを配布しているフリーアイコン素材サイトです。
複数のアイコンパックを配布しているWebサイトの中では珍しく著作権表記が不要で、アイコンの種類も非常に幅広いためとてもおすすめのサイトです。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 | アイコンパックごとに異なる |
iconmonstr（アイコンモンスター）
iconmonstrは4000種類以上のおしゃれなアイコン素材を無料で利用することができるサイトです。何よりこのWebサイト自体がおしゃれなのでついつい使いたくなってしまいます。
アイコンは「Collection」としてまとめられており、例えば「Airport」のコレクションでは飛行機や管制塔など、空港に関するアイコンがまとめられているので探しやすさも抜群です。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 |
|
icooon-mono
icooon-monoは6000種類以上のアイコンが無料で配布されているサイトです。もちろん商用利用もOKです。
PNGやJPGをダウンロードする時はサイズや色を指定できるので、ダウンロードしたらそのまま使用することができる点も使いやすくて便利ですね。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 |
|
Radix Icons
Radix Iconsは、15 x 15pxのシンプルなアイコンを配布しているフリーアイコン素材サイトです。
好きなアイコンをクリックすると、SVGのコードがコピーされるので、そのままHTMLにコピペしたり、デザインツールへインポートすることができます。メニューや管理画面などにアイコンを使用したい場合におすすめです。
MITライセンスなので、ソースコードなどに著作権表記を入れておきましょう。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 必要（MITライセンス） |
| ファイル形式 |
|
FLAT ICON DESIGN
FLAT ICON DESIGNは、フラットデザインのアイコン素材を無料でダウンロードすることができるサイトです。
アイコン自体のクオリティが非常に高いだけでなく、自分で背景色を選んだり、影のありなしを設定したりできるなど、使いやすさも抜群です。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 |
|
ICON BOX
ICON BOXは、パスが編集できるフリーアイコン素材サイトです。パスを残した形でデータが保存されているので、利用者が調整して使うことができるアイコン素材をダウンロードすることができます。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 |
|
icon rainbow
icon rainbowは、様々なカテゴリに分類された種類が豊富なフリーアイコン素材サイトです。
ダウンロード時に、サイズの調整や好きな色への変更が可能なので、PNGなどで利用する場合でも自分好みのアイコンにカスタマイズすることが可能です。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 |
|
Ikonate
Ikonateは、線の太さやサイズ、色などをカスタマイズしてダウンロードできるフリーアイコン素材サイトです。シンプルで使い勝手が良く、様々なシーンに使えるアイコン素材が揃えられています。
MITライセンスなので、ソースコードなどに著作権表記を入れておきましょう。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 必要（MITライセンス） |
| ファイル形式 |
|
IFN
IFNは、他のサイトと一味違う、ディテールにこだわったアイコン素材を配布しているサイトです。
少し大きなサイズで表示しても見劣りしない、おしゃれでスタイリッシュなアイコンをダウンロードすることができます。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 |
|
EXPERIENCE JAPAN PICTOGRAM
EXPERIENCE JAPAN PICTOGRAMは、日本デザインセンターによる日本の魅力を発信するためのピクトグラムを配布しているサイトです。
日本ならではのピクトグラムを含む、様々な種類のアイコン素材を利用することができ、Webサイトだけでなく印刷物やポスター、看板などに活用することができます。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 |
|
Icons8
30種類以上のスタイルからアイコンを探すことができるサイトです。Mac、Windowsそれぞれのアプリも提供されていて、各デザインツールへスムーズにアイコン素材をインポートすることができます。
フリープランで利用する場合は、アイコンを使用するページにリンクを記載したり、低解像度のファイルのみダウンロードできるなどの制限があります。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 必要（掲載ページやフッターへのリンク記載） |
| ファイル形式 |
|
FLATICON
FLATICONは、カラフルで高クオリティなフリーアイコン素材が配布されているサイトです。
アイコンパックごとにライセンスが指定されていますが、基本的に著作権表記が必要なものがほとんどなので、使用する際はライセンスを確認するようにしてください。
| 商用利用 | アイコンパックごとに指定 |
|---|---|
| 著作権表記 | アイコンパックごとに指定 |
| ファイル形式 |
|
Iconfinder
Iconfinderは、30万種類以上のフリーアイコン素材を探すことができるサイトです。とにかくアイコン種類が豊富で、パックとして配布されているので使い勝手にも優れています。
商用利用の可否、著作権表記の要不要などのライセンスについては、アイコンパックごとに指定されています。必ずライセンスを確認してから使用するようにしましょう。
| 商用利用 | アイコンパックごとに指定 |
|---|---|
| 著作権表記 | アイコンパックごとに指定 |
| ファイル形式 |
|
SVG PORN
SVG PORNは海外の有名な企業やサービスのロゴやアイコンをSVGファイルとしてダウンロードすることができるサービスです。
AppStoreやApple Pay、Google Analyticsなど様々なサービスのアイコン素材をゲットすることができます。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 | SVG |
Font Awesome
Font Awesomeは無料で1500種類以上のアイコン素材を利用することができるサービスです。アイコンフォントとして使ったことがある方も多いと思いますが、実はSVGファイルをダウンロードすることができます。
2,3個のアイコンしか使用しないような場合は、CSSやJSのファイルを読み込むよりもページサイズを小さくすることができるので、SVGファイルとして使う方法がおすすめです。
SVGファイルをダウンロードしたい場合は、アイコンの詳細ページのタイトルの下に表示されているアイコンをクリックするとダウンロードすることができます。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 | SVG |
アイコンフォントとしてのFont Awesomeの使い方はこちらの記事でご紹介しています。
Material Icons
Material IconsはGoogleが提供するアイコン素材サービスです。Androidで使用されているアイコンなどもダウンロードすることができるので、UIデザインで使えるアイコン素材がたくさん提供されています。
また、Material Iconsはアイコンフォントとしても使用することができるので、Webサイトで利用する時もCSSだけで簡単にアイコンを表示することができます。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 |
|
icon-pit
icon-pitは、3,000種類以上のアイコンを配布しているフリーアイコン素材サイトです。
カテゴリごとにアイコンが分類されていて、種類も豊富なのでトーンやスタイルを統一してアイコンを利用したい場合におすすめです。
| 商用利用 | OK |
|---|---|
| 著作権表記 | 不要 |
| ファイル形式 |
|
