秋らしいデザインを制作する時に参考になるWebサイト＆紅葉や落ち葉のフリー素材まとめ

2021/03/22

当ページのリンクには一部広告が含まれています。

URLをコピーしました！

春はあけぼの、夏は夜…とくれば、「秋は夕暮れ」ですよね〜！というわけで、今回は夕空と紅葉がテーマのデザインです。11月いっぱいまで公開する予定です！今回もPC版しか作っていないので、スマホの方はPC版表示にして確認してみてくださいね〜！

参考になる！美しい秋のデザインいろいろ

秋デザインを制作する時に参考になるWebサイトやポスター、グラフィックデザインなどを集めてみました！

極彩の秋紅葉の東部カナダ

ファーストビューの写真が美しい「エア・カナダ」のプロモーションサイト。やっぱり秋デザインのキーワードといえば「紅葉」ですよね。赤・黄色・緑・茶色など様々な色を楽しめる紅葉は秋デザインには必須ともいえるモチーフなのかもしれません。それにしてもカナダでもこんなに美しい紅葉が見られるんですね！行ってみたい。

エア・カナダ【日本】カナダ・オンタリオ州、ケベック州とその近郊情報サイト「極彩の秋紅葉の東部カナダ」

星野リゾートの温泉旅館ブランド「界」

有名な高級旅館である「星野リゾート」。こちらはそのブランドの中の温泉旅館「界」の2015年版秋シーズンサイトです。こちらは日本の紅葉なので、和風テイストに仕上がってますね。抑えめな配色の秋デザインは和風デザインとも相性がいいようです。

紅葉と月を愛でる美食旅| 星野リゾートの温泉旅館ブランド「界」

Seasonal Splendor | Tennessee Vacation

アメリカのテネシー州の観光サイト。ヒーローイメージの紅葉とヴィンテージ風なデザインがマッチしてとてもカッコいいですね。また、サイト内には手書き風のフォントが所々に使われていてオシャレ感も！秋デザインにはこういったグランジ感のあるデザインや手書きっぽいテイストにもピッタリですね。

Seasonal Splendor | Tennessee Vacation

Official Idaho Vacation and Travel Planning Guide

こちらはアメリカのアイダホ州の観光サイト。秋らしい画像をどどーんと背景に敷いています。こちらもヴィンテージ風なデザインですが、フラットなテネシー州のデザインとは違ってスキューモーフィックデザインに近いです。細部の作り込みが素晴らしく、古い紙や木目調のテイスト、落ち着いた色調などが秋の画像とよく合っていますね。

Official Idaho Vacation and Travel Planning Guide

Forrst | Autumn – WordPress Theme – A post from detrans

ZURBというデザイン会社が運営している「Forrst」というデザイナーのコミュニティサイトより。秋のWordpress用デザインテーマだそうです。秋のカラフルな配色と活き活きとした写真使いに目が奪われますね！

Forrst | Autumn – WordPress Theme – A post from detrans

マリノアシティ　実りの秋 | Oeuflab｜ウフラボ

「マリノアシティ福岡」のポスター。2012年のものだそうですが、カラフルな色合いと可愛いイラストがとてもよく似合っています。

マリノアシティ　実りの秋 | Oeuflab｜ウフラボ

Gallery: Beautiful Typography, Lettering & Calligraphy | From up North

「From up North」という海外デザインブログの記事より。カンバスに描かれたような落ち葉のイラストとタイポグラフィが美しいです。

Gallery: Beautiful Typography, Lettering & Calligraphy | From up North

秋デザインに使える！フリーWeb素材（ベクターデータ）

シルエットデザイン

フリーのベクターデータ素材といえばここ！ありとあらゆるシルエットを扱っているシルエットデザインさん。いつもお世話になってます！「葉っぱ」で検索すると色々な種類の葉っぱのベクターデータが入手できます。もちろん秋に使えるカエデやイチョウの葉っぱのシルエットもバッチリ！

シルエットデザイン

ちなみに、私がテーマ内で使っているのは上記画像の上ふたつ。背景パターンやトップへ戻るボタンなど、至るところに使用させていただいてます。

ベクタークラブ

こちらも、フリーのベクターデータをたくさん扱ってくれている素材サイトです。とにかく素材ひとつひとつのクオリティが素晴らしい。秋だけでなく、四季折々のベクターデータを取り揃えています。「自然・風景」で絞り込むとたくさん四季の素材を見つけられますよ。

ベクタークラブ＜イラストレーター素材が無料＞

私が使用させていただいているのはこちら。ベクターデータなのでトップ画像などの大きな部分にも使用できます！

紅葉が舞う秋のデザインエレメントのイラストai/eps

秋デザインに使える！フリーWeb素材（写真）

ぱくたそ

秋の写真を探すならぱくたそ！こちらもいつもお世話になってます！ぱくたそには季節ごとに写真がカテゴリー分けされているため、検索にとても便利です！

2018年10月24日　追記

いろいろなテーマで使える写真素材を厳選したページ「ぱくたそセレクション」で秋デザインに使える写真が一覧でまとまっています！こちらもチェック！
秋といえば、「紅葉」「食欲」「読書」などのフリー素材集 | ぱくたそセレクション・まとめ

ぱくたそ – フリー写真素材・無料ダウンロード

ちなみに、今回のデザインで私が使用させていただいた写真はこちら。

赤く紅葉した木
 もみじの落ち葉

ヘッダーのコウモリとフッターの落ち葉のテクスチャの部分に使用しています。フッターのテクスチャはPhotoshopでシームレスにしてパターンとして敷いています。

秋素材が置いてあるサイトいろいろ

その他にも秋デザイン用の素材はたくさん！ざっとご紹介しますよ。

Webdesigner Lab

落ち葉のシームレスパターンやPhotoshopブラシなどが置いてあります！「leaves」で検索するとヒットしますよ。

Webdesigner Lab – tutorials, templates, resources for web designers

フリーデザイナー

こちらも季節のタグ一覧があり、「秋」で絞り込んでみるとPSDやAIなどたくさん秋デザイン用の素材が見つかりますよ！使用に関しては素材それぞれにライセンスがあるそうなので、自身で確認してみてくださいね。

無料素材イラスト・ベクターのフリーデザイナー

秋素材のまとめ記事

ベクター素材やブラシ、テクスチャ…などなど。秋デザインを制作する時に便利な素材をまとめた記事たち。こちらも参考にどうぞ！

秋デザインに使える配色

鮮やかすぎてもダメだし、かといって渋すぎる色も・・・。簡単なようで意外と難しい秋デザインの配色。そんな時は以下の記事が参考になりますよ！

秋をイメージさせるカラー配色

秋の配色や、寒色・暖色との組み合わせ方などが書かれていてとても参考になります！色コードつきのカラーパレットも用意してくれているのが嬉しい。私は寒色と組み合わせるのは難しそうだったので、今回のデザインは暖色で固めました。

シーン別カラーチャート | 秋をイメージさせるカラー配色 | Web制作会社スタイル

2015年秋のトレンドカラー

デザインだけでなく洋服の組み合わせの参考にもなりそうな記事。Photoshop用のスウォッチファイルもダウンロードできて便利！

この秋、デザインやファッションに使いたい10色 -2015年秋のトレンドカラー | コリス

ちなみに私はAdobe Color CCで「autumn」というワードで検索し、好みの配色を見つけました！Adobe Color CCは自分の好きなカラースキームを作成することができ、Adobeアカウントを持っていれば好きな配色を保存しておけたりPhotoshopにスウォッチとして登録できるのでオススメです！