どうも、デザイナー篠原です。
最近WEBデザイン以外の仕事が多いので、空き時間に色々なWEBサイトを巡ってデザインを眺めていることが多いです。
色使いやレイアウトなど様々なパターンがあって、見ていて飽きないですね。
そんなたくさんのパターンがある中、【モノクロ+α】でデザインされたWEBサイトがいくつか気になったので、今回は【モノクロ+α】でデザインされた素敵なサイトを紹介したいと思います。
モノクロ+ゴールド
株式会社DONGURI
こちらは株式会社DONGURIさんのWEBサイトです。
モノクロ+ゴールドでデザインされています。
スチームパンクっぽい独特なタッチのイラストやゴシックっぽいフォントの雰囲気と、ワンポイントで使われている少しくすんだゴールドが絶妙にマッチしていて素敵です。
黒の割合が多いので、サイト全体にずっしりとした重厚感がありますね。
モノクロ+ブルー
シミズホーム
こちらはシミズホームさんのWEBサイトです。
先程のDONGURIさんのサイトとはがらっと変わり、明るめの色の割合が多く、全体的にすっきりとした印象です。
余白の使い方やフォントのまるっとした感じが水色の洗練されたイメージを際立てます。
Wolf&Whale
こちらはWolf&WhaleさんのWEBサイトです。
薄めのグレーを背景にして、ハッキリした青がポイントで使われています。
白の割合が少ないことから、少し落ち着いた感じのイメージを持ちます。
綺麗なレイアウトとこだわり（と思われる）のアニメーションが引き立ちます。
モノクロ+ピンク
DAISO（ダイソー）
https://www.daiso-sangyo.co.jp/
こちらは100円ショップとして有名なDAISOのサイトです。
今年の3月にロゴデザインが刷新されてから、サイトデザインも一新されました。
白、薄グレーとあわせて大胆にパキッとしたピンクが使われており、いいアクセントになっていますね。
今までの企業イメージからもガラッとかわり、今っぽいデザインになっています。
Caroselling Web Agency
日本語以外の言語に疎いので怪しいですが、おそらくイタリアのWEBデザイナーさんのサイトです。
型にとらわれないレイアウトに、ホバーアクションでちらっと出てくるピンクがアクセントになっています。
完全にモノクロで作られた一見無機質なサイトですが、ホバーで出てくるピンクや綺麗なアニメーションがサイトにあたたかみを与えてくれます。
モノクロ+オレンジ
DRIVE CHART
こちらはDRIVE CHARTというサービスのサイトです。
薄いグレーと少し紺っぽい色味の濃いグレーにはっきりとしたオレンジの配色です。
グレーに少し青っぽい色味がまざっていることで、よりオレンジとの親和性がとれています。
モノクロと言えども、こういったちょっとした工夫があることでサイト全体の完成度が上がりますね。
モノクロ+レッド
IoTNEWS生活環境創造室
こちらはIoTNEWS生活環境創造室のサイトです。
モノクロの中で赤がかなり目を引くデザインです。
サイトのコンテンツをイラストの色味とあわせていることで、全体の雰囲気にまとまりが出て綺麗ですね。
イラストの雰囲気も相まって、可愛らしい雰囲気のサイトです。
モノクロ+αの配色パターンを有効活用しよう
いかがでしたでしょうか。
モノクロの中に一色だけ色が入っていることで、複数色使った場合よりもより目立たせたいコンテンツを引き出すことが可能になります。
また、白やグレーの色味を少しいじってみたり、フォントの種類を使い分けたりするだけでもサイト全体の雰囲気をかんたんに操作することが出来ます。
機会があれば、ぜひモノクロ+αのデザインに挑戦したいですね！
