HomeCVR改善対策TipsShopifyストアバナー素材おすすめサイト43選 (フリー・有料) 初心者からプロまで使える!
バナー素材おすすめサイト43選 (フリー・有料) 初心者からプロまで使える!
Quick links
バナー素材に使える
おすすめサイト
写真やアイコン、イラストといったバナー素材を使えばカラフルなデザインのバナー広告を作成でき、よりユーザーの目を引く広告の作成が可能です。しかし、このようなハイデザインなバナー広告の作成を企業やデザイナーに依頼すると、多額のコストが掛かってしまいます。
一方、近年では優 れたデザインの素材を入手できるバナー素材サイトが多数登場しており、個人で運営するWebサイトで自由にバナーをデザインしたい、またバナー作成に余分なコストを掛けられないといった場合でもDIYで安価にバナーを作成することが可能です。
バナー素材を使ってバナーを作成するために押さえておきたいコツやポイントも踏まえ、シンプルかつおしゃれなバナーデザインを実現するおすすめのバナー素材サイトをご紹介します。
バナー素材を使ったバナー作成のコツ
バナー素材を扱う国内・海外サイトの両方をチェック
バナーデザインに使える素材を取り扱うWebサイトは、国内でも多数運営されています。国内のサイトは日本語で分かりやすく、使い勝手が良いという側面があります。加えてさらなるデザイン性の高さを求めるのであれば、海外サイトの利用も検討すべきと言えます。
海外のバナー素材サイトは世界中のクリエイターが参加しており、そのラインナップの多さやデザイン性の高さ、国内サイトにはないサービス利用ができることなどが特徴です。サイトは英語で運営されている場合もありますが、日本語対応のサイトもあります。国内・海外両方のサイトをチェックしましょう。
有料のバナー素材も活用する
バナー素材にコストを掛けたくないのであれば、主に無料のサービスを利用することができます。しかし、素材のクオリティや利用できるサービス内容などを加味すると、無料よりも有料のバナー素材を使った方が思い通りのバナーが作成できる場合もあるでしょう。
バナー素材を作成・入手するにあたっては、無料のサービスだけでなく、有料サービスの利用も検討してみましょう。
バナー素材のライセンスを確認する
画像やイラスト、アイコンなどのバナー素材を入手し利用する際、重要なポイントとなるのがライセンスです。バナー素材を取り扱う各サイトでは素材についてのライセンスを明記しており、素材の編集の可否やクレジット表記の必要・不必要、商用利用が可能なのかなどを設定しています。
バナー素材利用の際は、その素材で何ができるのか、またクレジット表記等が必要なのかを明確にするために、必ずライセンスを確認した上で活用するようにしましょう。
バナー作成に使える写真・画像 素材(フリー素材)
Freepik
-
無料プランはクレジット表記必要
-
1200万点以上のリソース
-
画像DL10点/1日(無料プラン)
サイトデザインやバナー作成に必要な高画質の写真やデザイン、モックアップ、PSDを無料プランから利用できるFreePikは、2021年時点で1200万点もの商用利用が可能なリソースを提供するフリー画像サイト。アカウント登録を完了したユーザーは無料で1日10ダウンロードが可能となっています。無料での利用はクレジット表記が必須となっており、プレミアムライセンス取得でクレジット表記不要。
Unsplash(英語)
-
クレジット表記任意
-
300万点以上のリソース
-
DL数無制限
Pexels
-
クレジット表記不要
-
320万点以上のリソース
-
著作権なし
フリー画像素材の中でも優れたグラフィックデザインを無料で提供するPexelsは、世界の動向や時代の流れに沿ったコンテンツを提供することでも評価が高いフリー画像サイトです。画像等の商用利用可。バナー素材を検索する際もフラットデザインで使いやすく、検索もしやすいWebサイトとなっています。(CC0ライセンス)
Pixabay
-
クレジット表記不要
-
260万点以上のリソース
-
DL数無制限
Icons8 Photo
-
無料プランはクレジット表記・リンク必要
-
無料画像多数
-
有料プランで帰属要件なし
高解像度画像が利用可
プロが撮影したさまざまなイメージを参照、ダウンロードできるIcons8 Photo。素材はカテゴリとテーマ別に検索でき、美しい画像が用意されています。無料でダウンロードできる画像も多数あり、バナー作成に最適。月々$29で50枚の画像のダウンロードが可能になります。フリープランでの利用はリンクする必要があります。
Bucketlistly Blog(英語)
-
商用利用は許可が必要
-
オリジナル画像
-
世界各国の写真
Pete Rojwongsuriya氏によって運営されているブログサイト・Bucketlistly Blogでは、氏本人が世界中を旅行する中でカメラに収めた美しい画像が無料で公開されています。国ごとの写真や料理、自然といったカテゴリからフリー写真を検索・ダウンロード、バナー素材として活用できます。なお、写真の商用利用については許可を得る必要があります。(CC BY-NC 4.0 Attribution-Noncommercial)
バナー作成に使える写真・画像 素材(有料素材)
Envato Elements(英語)
-
シンプルなライセンシング
-
1000万点以上のリソース
-
DL数無制限
オーストラリアを拠点にデジタルアセットを提供するEnvato Elementsでは、1000万以上のストックビデオクリップをはじめとして、ストックイメージやフリーオーディオ、その他グラフィック、ウェブテンプレート、フォント、WordPressテーマ等、クリエイターがフル活用できる数多くのリソースを提供しています。7日間のフリートライアルあり。(Envato elements ライセンスFAQ )
Adobe Stock
-
通常ライセンス素材が利用可
-
DL10点 / 月
-
クレジットパックプランなら
すべての素材が利用可
Adobe社が運営するAdobe Stockは、PhotoshopやIllustratorといったおなじみのソフトウェアと連携して利用する事ができます。商用利用可能な写真やベクター、イラストなど1億点を超えるリソースから、バナー作成に使えるデジタルアセットをダウンロードできます。(adobe stockライセンス情報)
Shutter Stock
-
すべての画像が利用可
-
無料トライアルあり
-
DL10点 / 月
2022年5月時点で4億を超える写真と7,000万のベクター、2,500万のビデオ素材、その他音楽素材など圧倒的な素材数を誇るSutterStock。バナーデザイン等に必要な素材をキーワードとカテゴリで簡単検索、毎週無料で画像を1枚ダウンロードできるほか、内蔵の画像エディターで素材の編集も可能です。(Shuttersotock ライセンス)
Istock Photo
-
無料素材あり
-
DL10点 / 月(ベーシック画像のみ)
-
最もお得な価格でイメージを利用可
世界中のアーティストによって作成された商用利用可能な写真・クリップ・イラスト素材を豊富に取り扱う iStock Photo。バナー素材として使えるストック画像もクオリティが高く、評価の高いサイトです。日本国内の商用利用にフィットした素材の取り扱いも多く、支払いプランによって利用できる素材が分けられています。(iStockライセンス)
Deposit Photos
-
無料素材あり
-
DL25点 / 月(ベーシック画像のみ)
-
毎月の未使用ダウンロード数は
繰り越し(契約から1年間利用可)
ロイヤリティフリーの画像やベクター、動画など約2.4億もの素材を取り扱うDeposit Photosでは、バナーデザインに最適な高品質・高画質の写真などの素材が用意されています。詳細な素材検索ができ、オプションが多くフレキシブルな価格設定も特徴です。(Deposit Photoライセンス)
バナー作成に使えるイラスト素材
Storyset (英語)
-
登録不要・商用利用可
-
クレジット表記必要
-
カスタマイズ自由
Blash
-
クレジット表記必要
-
デザイン保存可能数5件
-
Proプラン無料トライアルあり
unDraw (英語)
-
アカウント登録不要
-
クレジット表記不要
-
シンプルで操作も簡単
Vecteezy (英語)
-
クレジット表記必要
-
4,000超のベクターイメージ
-
プロ・サブスクリプションプランあり
Open Doodles (英語)
-
躍動感あるオリジナルイメージ
-
イラストの配色変更
-
CC0ライセンス
Pablo Stanley氏による躍動感あるイラストのダウンロード・編集が可能なOpen doodlesでは、オープンデザインというコンセプトを元に数々のイラストをバナー素材として利用する事ができます。PNG・SVGで提供されるイラストはカラー編集も可能となっており、さまざまな用途において役立ちます。(CC0 License)
Blobmaker (英語)
-
流線形・曲線デザイン
-
カスタマイズ自由
-
SVG形式でDLが可能
Blobデザインとはカラフルなシミ、もしくは流線形デザインのこと。Blobmakerはサイトデザイン等に使えるBlobデザインを作成・編集できるサイトです。SVG形式でのダウンロードが可能となっており、バナー素材として、またWebサイトのアイキャッチや流線形の柔軟さをサイトデザインを取り入れるなど、さまざまな目的で活用できます。
関連記事
ポップアップ上のアニメーションはユーザーの注目を集めてエンゲージメントを向上させます。結果に繋がるアニメーションポップアップ作成手順をチェック!
Promolayer.io
フリープランもあるアイコン素材
Noun Project (英語)
-
無料プランはクレジット表記必要
-
300万個を超えるアイコン
-
商用利用可
世界中のアーティストによってデザイン、アップロードされたアイコンをダウンロードできるNoun Project。クリエイティブなピクトグラム・アイコンが多数揃っており、PNG/SVG形式でのダウンロードが可能です。無料プランでもすべてのアイコンにアクセスでき、有料プランの利用でクレジット表記が不要になります。(主にCC BY3.0 US)
Material design icons (英語)
-
オープンソース
-
6,000個を超えるアイコン
-
商用利用可
サイトのガイドラインに沿って作成された、6,000個近い数のアイコンからダウンロードできるMaterial Design Icons。ここにあるアイコンのラインナップはサイトオーナーによって作成されたもの、またユーザーによって投稿されたもので構成されており、様々なプラットフォームでの利用が可能。アウトライン・塗りつぶしのアイコンがあります。(Apach License 2.0)
Flaticon (英語)
-
無料プランはクレジット表記必要
-
100万個を超えるアイコン
-
商用利用可
さまざまなプロジェクトに活用できるアイコンをダウンロードできるFlaticon。100万個を超えるアイコンが用意されており、1日2,000個までのダウンロードが可能。PNG形式のアイコンを幅広く提供していますが、利用の際はクレジットを表示する必要があります。その他の形式を利用する場合はサブスクリプションの購入が必要です。なお、アイテムによってライセンスが異なります。(Flaticon Basic License)
Iconscout (英語)
-
素材によってクレジット表記必要
-
100万個を超えるアイコン
-
商用利用可
アイコンのほかに3Dイラストやアニメーション画像など、総数で470万点を超える素材を有するIconscout。PNG・SVG形式をはじめ、多くのフォーマットのロイヤリティフリー・アイコンをダウンロードできます。月間$12.99のアイコンオンリープランでは、アイコンのカラー編集ができるようになります。(Iconscout ライセンス)
Lineicons (英語)
-
クレジット表記不要
-
5,000個を超えるアイコン
-
商用利用可
トータルで5,000個超のアイコン素材があるLineicons。アイコンは認視性を重視して作成されており、どのデバイスでも分かりやすく表示できるアイコンが多数。フリープランでは532個のアイコンが無料でダウンロード可能です。有料プランではすべてのアイコンにアクセスできます。(Lineicons ライセンス) ※無料プランCC BY-SA 4.0
Icons8
-
クレジット表記必要
-
14万点を超えるアイコン
-
商用利用可
14万点を超えるアイコンが利用できるIcons8。無料プランではリンクの貼り付けで低解像度の素材、そして月$13の有料プランでは月100件の高解像度素材のダウンロードがリンク貼り付け無しで利用可能です。利用も簡単、無料プランでもアイコンのカラー変更等の編集が可能です。(Icons8ライセンス)
バナー作成に使えるフォント素材
Google Fonts
-
約1000種類のフォント
-
各デバイスで適切に表示
-
自由度が高い
Googleが提供する言わずと知れたフォントサービスサイト・Google Fonts。約1000種類のすべてのフォントが無料で使用できます。言語に沿ってフォントが検索でき、すべてのデバイスに最適化されたフォントは環境を選ばず適切に表示されます。(SIL open license)
また、Google Fonts Analyticsでは人気のフォントがチェックできます。
Fontpair(英語)
-
有料プランもあり
-
多数のフォントペア事例あり
-
メールリスト登録で
フォント情報入手
サイトやバナーデザインで欠かせないのがフォントデザインの組み合わせ。どのフォント同士が相性抜群なのかを知ることが出来るFontpairでは、Google Font内で相性の良いフォントをおすすめしてくれるサイトです。日本語フォントへの対応はしていないため、英語フォント同士の組み合わせをチェックするのに最適です。
デザイン事例/インスピレーション
Behance
-
クリエイター向けSNS
-
創造的作品からインスピレーションを得る
-
数百万件の作品
Adobeが運営するBehanceは、世界中のデザイナーが自分の作品をアップロードしているクリエイター向けのSNSサイトです。数々の作品事例からデザイン等のインスピレーションを得られるほか、お気に入りの作品を評価したり、作品を通じて人々と繋がることができます。バナー素材のアイデアを得る場所として利用でき、その他求人情報の閲覧、優良プランで求人情報を投稿することも可能となっています。
Dribble (英語)
-
誰でも参加が可能
-
あらゆる分野のデザイン
-
求人・求職も可能
Dribbleはアメリカ発のクリエイター向けSNSサイトです。紹介制による参加が可能なコミュニティでしたが、近年ではあらゆる分野のクリエイターが参加可能になりました。また投稿される作品はクオリティの高いものとなっています。世界中のデザイナーや企業が参加しており、無料アカウントが作成可能。色やタグから作品検索でき、バナーを作成するにあたりインスピレーションを得ることができます。
Screenlane (英語)
-
UI/UXデザイン
-
優れたデザインを学ぶ
-
最新のデザインをニュースレターでゲット
数多くの海外のWebサイトデザインを紹介しているScreenlane。バナーデザイン、サイトデザインの作品を参考にできることから、多くのUI/UXデザイナーに支持されているサイトです。実績のあるサイトデザインやランディングページのデザインからインスピレーションを得て、優れたサイト設計を学ぶことができます。
デザインに使えるカラーパレット
Adobe Color
-
カラーテーマ豊富
-
AdobeIDで全機能が利用可
-
他のAdobe製品と連携
バナーデザインに欠かせないカラーバランスですが、Adobe Colorではあらゆるデザインに必要な色の組み合わせを作成することができます。Adobe製品の互換性から使い勝手も良く、評価の高いサイトです。カラーテーマも豊富となっており、登録無料のAdobe IDがあれば余すことなく機能が利用できます。
Color Hunt (英語)
-
使いやすい
-
テーマごとのカラーの組み合わせ
-
Google Chromeの拡張機能として
季節や自然、ハロウィンといったテーマからカラーのコンビネーションが検索できるColor Hunt。サイトの設計も簡単で使いやすく、気になるカラーはマウスオーバーでカラーコードがチェックできます。人気のカラーもチェックでき、Google Chromeの拡張機能としてColor Huntを加える事もできます。
WebGradients (英語)
-
カラーグラデーション180種類
-
簡単コピー・CSSで取得
-
PNG形式のDLも可能
デザインにカラーグラデーションを取り入れるなら、WebGradientsが便利です。180種のカラーグラデーションコードを無料で参照する事ができ、カラーはPNG形式でダウンロード、またはCSSでコピーして取り入れることが可能です。作成するバナーに美しいカラーグラデーションをデザインに取り入れましょう。
Pigment by shape factory (英語)
-
多数のカラーグラデーションサンプル
-
2色のカラーの相性が分かる
-
SVG形式のDL・CSSコピーも可能
顔料という意味を持つPigmentですが、Pigment by shape factoryでは2つの異なる色の相性をチェックすることができます。数多くのカラーサンプルから各カラーの相性が確認でき、カラーナンバーも取得可能。アクションメニューからCSSコピーやSVG形式のdownload可能となっており、各種デザインイメージの配色に活用できるサイトです。
バナー作成に使えるデザインツール
Figma
-
さまざまなデザイン用途
-
共同作業が可能
-
コミュニティも豊富
デザインプラットフォームのFigmaは、ブラウザ上で共同編集ができるデザインツールです。バナーやウェブサイトのデザインをはじめ、SNS投稿用デザインの作成、モバイルアプリUIの作成やプレゼン資料の作成など幅広く活用する事ができます。参加できるコミュニティも数多く、有料プランではより共同作業に特化した機能が利用できます。
Sketch (英語)
-
30日間のフリートライアル
-
共同作業が可能
-
軽量なデザインデータ
SketchはWebデザインやUIデザインに特化した特徴を持ち、他のデザインツールと比較してこれらに必要な機能のみを兼ね備える洗練されたデザインツールです。デザインファイルも軽く、デザインの共有もでき、多くのデザイナーから支持を得ています。30日のフリートライアル後は有料プランへの移行が必要。
Affinity Designer
-
無料試用版あり
-
Mac・PC・iPadで利用可
-
高機能
Affinity Desinerは機能性が高く、比較的安価で活用できるデザインツール。デザイン作業に必要な機能のみを兼ね備えており、Illustratorの代替アプリとして認知され幅広く活用されています。また料金プランはサブスクリプション形式ではなく、Mac・PCで7000円の払い切りとなっています。機能制限のない無料試用版もあり。
Affinity Photo
-
無料試用版あり
-
Mac・PC・iPadで利用可
-
高機能
Affinity Designerと同じく高い機能性を持ち、安価で多くのデザイナーに支持されているAffinity Photo。操作性も軽快であり、Photoshopの代替えアプリとして知られています。料金プランはこちらもサブスクリプション形式ではなく7,000円の払い切りで、機能制限のない無料試用版もあります。
Photoshop
-
サブスクリプション形式
-
7日間の無料体験プラン
-
高機能
バナー作成に使えるPNG素材 サイト
KindPNG(英語)
-
著作権フリー
-
ダウンロード無制限
-
AIアルゴリズムで検索簡単
PNGWING
-
バラエティ豊富なPNGイメージ
-
シンプルで簡単な検索
-
ブラウザ上でリサイズ可
ネットを介してさまざまなユーザーがPNG画像をアップロードしているPNGWING。PNG画像が豊富なフラットデザインのサイトであり、検索からダウンロードまでの流れも非常にシンプルです。またブラウザ上でのサイズ変更も可能。PNG画像それぞれにライセンスが設定されており、画像ページで確認できます。商用利用可または不可のPNG画像があります。
PNGTree
-
無料プラン1日2DL可能
-
プレミアムプランでクレジット表記不要
商用利用可
無制限ダウンロード -
ベクターや写真もあり
PNGTreeではPNG画像を中心として、それ以外のベクターやJPG素材も取り扱っています。無料プランではダウンロードできる素材数も少なく、利用の際はクレジット表記が必要。プレミアムプラン登録で制限が解除され、クレジット表記不要・商用利用が可能になります。
freePNGs(英語)
-
17万点のPNG素材
-
商用利用可
-
バルクダウンロードもあり(有料)
背景を消した透過PNG画像を作成できるサイト
Removebg
-
無料で利用可
-
専用のPCアプリ・APIも
-
シンプルで使いやすい
PNG画像の背景を切り取り、透過PNG画像を簡単に作成する事ができるremovebg。画像を高画質なままで切り取ることができ、デスクトップアプリやAPIにも対応。無料プランでの利用では切り取り後の画像の商用利用や画質に制限があり、有料プランで商用利用可・高解像度画像に対応します。(removebg FAQ)
removal. ai
-
背景にグラフィック挿入が可能
-
専用のPCアプリ・APIも
-
有料プランが非常に安価
removal.aiは、AIが高度なアルゴリズムを使用して背景を分離させるツールです。また、画像を背景を分離させるだけでなく、テキスト挿入やコントラスト調整といった画像の編集や、バックグラウンドにグラフィックを挿入する事も可能となっています。有料プランから画像の商用利用、高解像度画像のダウンロードが可能になります。
バナー素材で美しいオリジナルバナーを作成
Webサイト作成に欠かすことができないバナー素材。近年ではWebサイト作成に慣れていない初心者からプロに至るまで無料または有料で高度な編集ツールの利用や、ハイデザインのバナー素材を入手する事ができるようになりました。国内サイトや海外サイトのこれらのツールを活用すれば、美しいオリジナルバナーを作成する事が可能です。