ウェブデザイン・マイスタイル
HOME
WEB作成上のポイント
WEBレイアウト
WEB配色の効果
CSSスタイルシート
DTP作成上のポイント
WEB&DTP作成ソフト
MyStyle制作実績
MAIL

HOME > WEB 配色の効果  

WEB 配色の効果

サイトのベースカラーは、WEB作成の初期段階で決定します。それをもとにコンテンツメニューにもってくる色や、フレームに使用する色、文字色など、配色を考えていきます。
サイトの内容によっては、イメージに合う色や合わない色もあるので、自分でカラーを組合せながら最終的に配色を決定していくことになります。

 以下のベースカラーに合う配色をご紹介します。

ベースカラーBlue(青)の配色
ベースカラーRed(赤)の配色
ベースカラーOrange(オレンジ)の配色
ベースカラーGreen(緑)の配色
ベースカラーYellow(黄色)の配色
ベースカラー Blown(茶色)の配色
ベースカラーPink(ピンク)の配色
ベースカラーPurple(紫)の配色
ベースカラーGray(グレー)の配色
ベースカラーBlack(黒)の配色



Blueの配色

清涼感や理知的なイメージをもつBLUE。見る側にストレスを与えない色。
インパクトをもたせたいならば、ボルドーなどを入れてもよい。

パターンj1
パターン2
パターン3

情熱的な、アクティブな印象を与えるRED。
朱色、ボルドーなど赤と言っても、違うイメージを持たせることができる。
ボルドーは少し落ち着いた雰囲気に。
緑との組合せでイタリアンカラーを強調するのも面白い。

パターンj1
パターン2
パターン3

親しみ深く、あたたかな印象のあるORANGE。
黄色や赤との組合せは、食物関連のサイトに使うとGOOD。食欲を増す効果あり。 黒を使えば、ぐっと引き締まった印象になる。

パターンj1 パターン2 パターン3

リラックス効果、安心感を与えるGREEN。
自然をテーマとしたサイト、医療・エステ関係のサイトなどによく使われる。
透き通ったイメージをだすなら、うすい緑を用いるとよい。

パターンj1 パターン2 パターン3

目にとまりやすいYELLOW。
紺との組合せは見る側に少々ストレスを与えてしまうので、他の色はなるべく多様しない方がよい。 茶色との組合せは、黄色のみの使用に比べ、ぐっと落ち着いた雰囲気に。 緑との組合せでは、優しいイメージを持たせることもできる。

パターンj1 パターン2 パターン3

落ち着いたイメージのあるBLOWN。
自然を感じさせるサイト、和的なサイトの他、食物関連のサイトでも使われる。


女性らしく、清楚なイメージをもつ薄いPINK。
美容、エステ、医療関係のサイトに多く見られる。
濃い色のPINKは見る側にストレスを与えるので、避けたい。


個性的な印象のあるPURPLE。
ピンクと同様、女性らしいイメージを持つ。
黄色との組合せで、印象的にするのも手。


かっこよくも、整頓されたイメージにも見せることのできるGRAY。
視覚重視のサイトでは、全体をグレーにし中央に画像や赤などをもってくるとインパクトがでる。ベージュとの組合せでは落ち着いた雰囲気に。


夜のイメージ、かっこいいイメージのあるBLACK。
BARや、最先端なイメージを持たせるサイトによく使われる。
緑などと組みせ、黒のきつさをやわらげるのもGOOD。

 
Homeへ

Web Design My Style