Asial Blog

Recruit! Asialで一緒に働きませんか?

グレーにカラフルな色が効いている国内&海外のサイトを14個まとめてみました。

カテゴリ :
デザイン・UI
タグ :
Tech
デザイン
グレー
Webサイト
こんにちは、花崎です。

最近髪の色を赤茶色にしました。
昔から赤毛の外国人さんを見ると、きれいな色だなと思っていたので紅葉のこの季節になると赤く染めます。

よく赤い下着を付けると元気になる、という情報を聞きますが確かに赤色を身に着けるだけで気分も上がります。
その他にパッションピンクや蛍光色、明度の高い色を好んで手に取っていました。

しかし派手なものを集めすぎて、かえってお互いの色や存在が目立たなくなったりします。

デザインをするときもそうです。
サイトを作る際に彩度の高い色を使いたいが鮮やかな色に合わせる色が…
というときに登場するのがグレーカラー。

ベースがホワイトはよくつかわれますが他に色味を欲しいとき、少し変化を付けたいときによく利用されます。

と、いうことで…

グレーにカラフルな色が効いている国内&海外のサイトを14個まとめてみました。




1.グリーン×グレー http://www.thebioagency.com/#/home
緑の使い方が目立ちすぎずグレーとマッチしています。





2.イエロー×オレンジ×グレー http://www.uxcambridge.net/uxc2012/index.php
モノクロの写真もオシャレに見えます。





3.イエロー×グレー http://kar.i-studio.co.jp/
イエローの色が際立っています。ピンクとの相性もいいです。





4.イエロー×グレー http://www.takaten.com/
イエローとブラックも使われていてイエローのマーカーで引いたような感じがして目がいきます。





5.ピンク×グレー http://pulla.tv/#/home/
ポイントだけ濃いピンクを使用しています。





6.ピンク×グレー http://www.metro-pro.co.jp/
薄いグレーに発色の良いピンクが際立って女性が好きそうなかわいいイメージがあります。





7.イエロー×色々×グレー http://www.ozanakoglu.com/
シンプルなつくりにイエローがポップな印象を与えてくれます。





8.オレンジ×ブルー×グレー http://www.acu.co.jp/
山吹色に近いオレンジとブルーの相性がいい感じです。





9.×蛍光レッド×グレー http://www.glamour.biz/
背景は水色に近いグレーで蛍光レッドのような一色で描かれています。





10.ブルー×グレー http://www.subtilstudio.com/
グレーの奥行きがある背景に水色がさりげないポイントになっています。





11.ピンク×色々×グレー http://visualized.com/
TOPにある、色が重なりあっているところが色のカラフルで目を引きます。





12.エメラルドグリーン×色々×グレー http://2012.hd-live.co.uk/
ありそうで日本じゃなかなか見ない組合せでした。オレンジとグリーンの色合いが素敵です。





13.ピンク×イエロー×グレー http://futureofwebdesign.com/prague-2012/
定番のピンクとイエローの組合せのちょっと彩度を落としてある感じいいですね。





14.オレンジ×グレー http://www.asial.co.jp/
最後は弊社のサイトです(笑)グレーにオレンジと水色を使用して作られています。




こうやってみてみると、グレーはいろんな色と相性が良いですね。
鮮やかな色を大胆に入れたりちょこっと入れてみたりしてもどれも色の良さを引き出してくれる気がします。

こうするだけで少しセンス良く見えたりします。

薄いグレーから濃いグレー、黄味がかったものや青味の強いもの。

それぞれを使いこないして素敵なサイトを作りあげたいですね。