ココだけ欲しい！Webデザインのパーツをまとめたギャラリーサイト36選

この記事は2015年10月22日に公開された記事を再編集したものです。

デザイン作業に慣れてくると、どうしても自分の癖が出てしまい、似たようなデザインばかりになってしまいがちです。特にWebデザインのパーツは、毎回同じようなデザインを作ってしまうことも少なくありません。しかし、自分が持っているアイデアだけでは、なかなか新しいデザインは浮かんでこないものです。

そこでオススメしたいのがギャラリーサイトです。その中でもパーツごとに収集したギャラリーサイトは、デザインの「部分」だけでも参考にすることができるため非常に便利です。デザインアイデアが欲しい時こそ、多くのヒントが詰まっている素材サイトを活用しましょう。

今回は、Webデザインのパーツをまとめたギャラリーサイトを36個まとめてご紹介します。

※サイトによっては素材やソースコードなどを配布・掲載しているものもあります。ご利用の際は、必ず利用条件等をご確認いただき、ルール厳守の上でご利用ください
　　

Webデザインのパーツを収集したギャラリーサイトまとめ

1. Freebies Booth

http://freebiesbooth.com/

「Freebies Booth」では、Webデザイナーに向けて様々な素材を提供しています。ギャラリーサイトとしてデザインの参考に活用するのはもちろん、気に入ったデザインがあればデータのダウンロードもできます。

デザインは最新のものから一覧表示してありますが、右側メニューから順番を並び替えたり、キーワード・タグで絞り込むことが可能です。最近は更新していないものの、保管数は多いので参考にしてみてはいかがでしょうか。
　　

2. バナーデザインアーカイブ

http://banner.keizine.net/

バナーを作る際、いつも似たようなデザインになりがち……という方も少なくないはずです。そうしたバナーデザインの悩みを解決したい時にオススメしたいのが、「バナーデザインアーカイブ」です。

2,129個（2017年10月4日確認時点）ものバナーを公開しているバナー専門ギャラリーサイトで様々なバナーを見ることが可能で、ページ右手からサイズ・色・業種・キーワード絞り込みができて素早くバナーデザインを見付けることができます。
　　

3. bannergallery

https://bannergallery.net/

バナー広告デザインのインスピレーションが欲しい、という時に活躍するギャラリーサイトです。掲載数は3,024個（2017年10月4日確認時点）と豊富で、幅広いサイズのバナーをバランス良く取り揃えています。

サイズだけでも33個のカテゴリを用意していますので、定番サイズから少し変わったサイズのデザインもすぐに見付かるのではないでしょうか。とりあえず、たくさんのデザインをチェックしたい、探しているサイズが見付からない、という方は必見です。
　　

4. Web Design Ledger

https://webdesignledger.com/large-website-headers/#sthash.f413UjhN.dpbs

「Web Design Ledger」では、Webデザイナーがインスピレーションを得ることができる様々な情報を発信しています。そのほかのギャラリーサイトと形態は異なるものの、Webデザインのアイデア収集に役立つのではないでしょうか。

リンク先のページでは、海外のホームページのヘッダーデザインを見ることが可能です。
　　

5. バナーデザインギャラリー

http://www.banner-design-gallery.com/

「バナーデザインギャラリー」は、ユーザーからの投稿をもとにバナーを収集掲載しているバナー専門ギャラリーサイトです。

最大の特徴は5点満点の評価機能で、ほかのユーザーが各バナーをどれくらい評価しているかがわかります。単にデザインを見たいだけではなく、デザインに対する反応・評価を知りたい方にぴったりなのではないでしょうか。

バナー掲載数は558個（2017年10月4日確認時点）で多くは国内のものとなっていますが、海外のバナーも一部見ることができます。
　　

6. IconJ

http://www.iconj.com/

ファビコンのデザインがいまいち決まらない、そもそも作り方がわからない……という方にオススメしたいのが「IconJ」です。ファビコンのデザインギャラリーとジェネレーターが一体化したサービスで、画像をもとにファビコンを自動生成することができます。

デザインのアイデア探しからファビコン作成まで1つで完結できるので、ファビコンが必要になった時にはぜひ使ってみてください。
　　

7. バナーデザインまとめ

http://bannermatome.com/

可愛いバナー、カッコいいバナーをサイズ別や業種別で検索できるギャラリーサイトです。掲載はバナーに特化しており、19,600個ものバナーを掲載しています。（2017年10月4日確認時点）

バナーを「テキスト風」「手書き風」などの表現別に探せるのも特徴的で、欲しいデザインをいち早く見付けることができるのではないでしょうか。

バナーのサイズ、形式などについての解説ページもあり参考になります。
　　

8. Favicon & App Icon Generator

https://www.favicon-generator.org/

ファビコンジェネレータとアイコンギャラリーが一体化したサービスです。ギャラリーには様々なファビコンが掲載してあり、文字・色・キーワードで絞込検索することができます。

意外と決まらないファビコンデザイン制作の参考にしてみてはいかがでしょうか。
　　

9. AWWWARDS

https://www.awwwards.com/websites/navigation/

有名ギャラリーサイト「AWWWARDS」のナビゲーションに特化した紹介ページです。優れたナビゲーションデザインが揃っていますので、デザインネタ収集に活用してみてください。
　　

10. UI Movement

https://uimovement.com/

UIのアニメーションを収集したギャラリーサイトで、様々なアプリやホームページの秀逸なUIを見ることができます。

ボタン・カレンダー・グラフ・ナビゲーション・タブなどパーツごとにタグを設定しているので、探したいパーツのデザインがすぐに見付かります。画像をクリックすると、参照元にリンクすることも可能です。
　　

11. UIDB.io

https://uidb.io/

「UIDB.io」は、多種多様なパーツごとのデザインを収集しているギャラリーサイトです。キーワード検索、タグ検索を利用してデザインの検索を行うことができます。

検索フィルタや価格表、サインアップ画面、チーム紹介など、多くのホームページには欠かせないパーツデザインが揃っています。また、退会ページなど、ほかのギャラリーサイトではあまり扱っていないデザインも豊富です。総合的にパーツデザインを収集しているギャラリーサイトをお探しの方は、ぜひ参考にしてみてください。
　　

12. Calltoidea

http://calltoidea.com/

「Calltoidea」は、わかりやすいカテゴリわけと豊富な収集ジャンルが特徴的なギャラリーサイトです。トップページにカテゴリごとにアイコンを配置しており、好きなアイコンをクリックするとデザインの絞り込みができます。

掲載しているパーツは、ログイン画面・ポップアップ・アラート・カレンダー・フッター・ナビ・スライダーなど様々です。ここだけでホームページに必要なパーツは全て揃うのではないか、というくらい豊富に揃っています。
　　

13. Designs Crazed

https://dcrazed.com/jquery-navigation-plugins-menus/

Webデザインに関する様々な情報を発信する「Designs Crazed」内の、ナビゲーションメニュー紹介ページです。斬新なアイデアのナビゲーションメニューを多数掲載してあり、デモ・ソースも確認することができます。
　　

14. Collect UI

http://collectui.com/

10,000個以上（2017年10月4日確認時点）のパーツを掲載し、とにかく豊富にデザインチェックができるギャラリーサイトです。掲載カテゴリーも159種類と多いため、ほかのギャラリーサイトでは見付からないようなパーツも楽に探すことができるのではないでしょうか。

デザイン画像をクリックするとページを移動することなく拡大できるため、時間をかけずにサクッとたくさんのデザインを見ることができます。
　　

15.Patternry

http://patternry.com/patterns/

デザインパーツ、カラースキーム、タイポグラフィ……とホームページのあらゆる要素をコレクションしているギャラリーサイトです。デザインによっては、ソースコードを確認することもできます。

デザインのアイデア収集はもちろん、どのようにコードを書くのか参考にしたい、という方にもオススメです。
　　

16. inspirationui

http://inspirationui.com/

デザインパーツのカテゴリが豊富な点が魅力的なギャラリーサイトです。フッター・フォーム・ボタン・メニューをはじめ、ついデザインに迷ってしまいがちなパーツが多数揃っています。リンクアイコンからすぐに引用元のページに移動できるのが便利です。
　　

17. Websites with Ghost Buttons

http://websiteswithghostbuttons.tumblr.com/

その名のとおり、様々なホームページのゴーストボタンだけを収集しているユニークなギャラリーサイトです。ゴーストボタンを設置しようと考えた際、参考になるのではないでしょうか。
　　

18. WEBデザインのメインビジュアルまとめ

http://mainvisual.net-king.com/

ホームページを開いた時に一番最初に目にとまるのは、メインビジュアルではないでしょうか。WEBデザインのメインビジュアルまとめでは、コンバーションに直結しそうなものを中心にメインビジュアルデザインを収集・掲載しています。
　　

19.MAIN VISUAL collection

http://mvisual-collection.dslrs-journal.info/

メインビジュアルに特化したギャラリーサイトです。スタイリッシュ・ポップ・可愛い……などイメージごとに絞り込みができますので、ホームページのデザインにぴったりな参考画像が見付かります。色ごとの絞り込みや表示回数でランキング表示することも可能です。
　　

20. ブブンデザインアーカイブ

http://bubundesignarchive.jp/

Webデザイナーによる、優れたパーツを集めてアーカイブしたギャラリーサイトです。「Webデザイナーのアイデアインスピレーションを加速化する」をコンセプトに、デザインのヒントになるパーツを多数収録しています。

気になる部分のデザインをそのままデザインソフトにドラッグすることで、新しいアイデアを創出することができます。ブブン別、業界別の分類で探しやすくなっていますので、必要な時にすぐにデザインを見付け出すことが可能です。
　　

21. UI-Patterns

http://ui-patterns.com/

掲載量、カテゴリわけが豊富なギャラリーサイトです。例えば、フォームだけでも12種類に分類されていて、収集しているパーツの種類が多く、ほかではあまりないパーツも探すことが魅力です。
　　

22. UICloud

http://ui-cloud.com/

数々の良質なUIを検索することができるギャラリーサイトです。現在46,000以上の要素を揃えています。（2015年9月11日時点）

キーワード、カテゴリ検索でサクッと探し出すことができ、素材のダウンロードも可能です。海外ギャラリーではありますがわかりやすいアイコンが付いていますので、英語が苦手という方にも使いやすくなっています。
　　

23. フッターデザイン.com

http://footer-design.com/

ホームページのフッターだけを収集したギャラリーサイトです。イラスト、横並びメニュー、カラムメニューといった全部で6つのカテゴリで分類されています。

収集しているのは、ほとんどが日本国内のもので、日本人に使いやすく、参考にしやすいのもポイントです。フッターのデザインに悩んだ時には、ぜひ目をとおしておくことをオススメします。
　　

24. pttrns

http://pttrns.com/

iPhoneやAndroid向けのデザインパターンを豊富に収集したギャラリーサイトです。

計算機、チャート、チェックインといったお馴染みの画面の様々なデザインを揃えています。アプリデザイン、スマートフォン向けのデザインを行う際、特に参考になります。
　　

25. ui parade

http://www.uiparade.com/

ボタン、フォーム、スライダーといった要素を、シンプルにまとめたギャラリーサイトです。ページ自体もすっきりとしていて美しく、見やすいデザインとなっています。

任意のデザインをクリックすると、デザイナー、関連パーツの情報も閲覧可能です。
　　

26. House of Buttons

http://houseofbuttons.tumblr.com/

素敵なデザインのボタンだけを収集したギャラリーサイトです。あらゆるボタンがとにかく数多く揃います。

細かい分類はしていませんので、たくさんのデザインをサクサク一気に見たいという時にオススメです。
　　

27. Croppy

http://croppy.org/

パーツ別にわかりやすく分類したギャラリーサイトです。ヘッダー、ロゴ、イメージ、見出しほか全部で9カテゴリの部分パーツを見ることができます。タグでさらに絞り込むことができる上に、色彩分析をしてある点もユニークです。また、元のホームページも掲載してあり、使用イメージをリアルに確認できます。本格的にデザインを検討したい場合に便利です。
　　

28. 見出しデザイン.com

http://midashi-design.com/

ホームページの見出しデザインに特化したギャラリーサイトです。グラデーション、テキストのみ、角丸、四角という風にデザインのテイストごとにわけてありますので、好みの見出しを容易に探すことができます。サムネイルをクリックすると、デザイン元のページにリンクすることも可能です。

見出しのデザインが浮かばない時に見ると、アイデアが浮かびます。
　　

29. ファビコンギャラリー.com

http://favicon-gallery.com/

様々なホームページから、ファビコンだけを集めたギャラリーサイトです。カテゴリ、カラーごとに絞り込み検索することができますので、自社の業種やホームページのデザインに合うファビコンを探し出すことができます。ギャラリーとあわせて、ファビコンの作り方も丁寧に紹介しています。
　　

30. Elements of Design | Smiley Cat

http://www.smileycat.com/design_elements/

色々なデザインパーツをまとめたギャラリーサイトです。

シンプルなページ設計となっていて、無駄が無いのが特徴的です。パーツのカテゴリも40種類以上が揃っていて、あらゆるデザインを閲覧することが可能です。
　　

31. HEADER LOVE

https://headerlove.com/

参考になる素敵なヘッダーだけを収集した、ヘッダーデザインに特化したギャラリーサイトです。様々なパーツを収集したギャラリーとは違って1つひとつの画像が大きいので、デザインをしっかりと見ることが可能です。

数は少なめですが、ヘッダーをデザインする際には参考にしたいギャラリーです。
　　

32. WEBサイトカッコイイ

http://fukuoka-web.hustle.ne.jp/

カッコいいホームページだけに絞って集めたギャラリーサイトです。パーツに特化したページではないものの、背景画像、ヘッダー、見出しほか要素ごとに見ることができます。

サムネイル下に出典元を表記してありますので、どこのデザインかがすぐにわかります。様々なジャンルのホームページを対象にしていますので、色々なデザインに出会えるのが魅力です。
　　

33. BANNER LINKS

http://nonamedesign.info/banner/

バナーデザインに特化したギャラリーサイトです。業種別、サイズ別、色別に分類してあり、探しているバナーをいち早く見付けることができます。

カテゴリも多く、バナーの数も大量に揃っています。
　　

34. バナーデザインデータベース

http://aka-design.sub.jp/bd/

バナーを中心に、メインビジュアルパーツ、ボタンを収集したギャラリーサイトです。タイプ、カラー、テイストで絞り込むことができます。

キュート、クール、和風といったテイストに分類してありますので、イメージどおりのデザインがすぐに見付かります。
　　

35. Web Banner Gallery

http://web-banner-gallery.com/

海外のハイセンスなバナーをたくさん見ることができるギャラリーサイトです。サイズの分類が非常に細かく、全部で15サイズを指定して絞り込みができます。

ユーザーからのコメントが見れるほか、評価も付けることも可能です。
　　

36. Retrobanner

http://retrobanner.net/

少しレトロなバナーをコレクションしているギャラリーサイトです。検索機能が充実していて、サイズ、業種、色、テイストで条件を指定して絞り込みできます。

とにかくあらゆるデザインのバナーが大量に揃っている点も大きな魅力です。