» 【Webデザイン入門】配色についてまとめてみた【第4回】

【Webデザイン入門】タイポグラフィについてまとめてみた【第3回】

前回の記事

前回はWebサイトのタイポグラフィについてまとめた。今回はデザインの要とも言える配色についてまとめてみる。

1. 色とは

色は「色相」、「明度」、「彩度」の3要素で決められる。

「色相」は赤、橙、黄…のように色相環で表される様相の違いで、暖色、寒色、中性色に分けることができる。そして「明度」は色の明るさ、「彩度」は色の鮮やかさのことだ。

暖色は「興奮」や「暖かさ」などを、寒色は「鎮静」や「寒さ」を印象として与える。

そして暖色かつ明るいほど膨張感や進出感を与え、寒色かつ暗いほど収縮感や後退感を与える。

これらを図に表してみたので、感覚を掴んでもらえると嬉しい。

また彩度が強いと派手さを、弱いと地味さを表現することができる。

ベースカラー70%、メインカラー25%、アクセントカラー5%という配分にすると良いらしい。

メインカラーはそのページで使いたい色。

ベースカラーはメインカラーの明度を上げた色。

アクセントカラーは色相環においてメインカラーの対極らへんにあるものを選ぶとよい。

配色を分割することで対応する。

分割する際は「色相が同じでトーンが違う」or「トーンが同じで色相が違う」ものを選択する。

色はセンスで選ぶものと勝手に思い込み、長年諦めてきたが、実際にはある程度の理論に沿って選択できることが分かった。

もちろん細かな色の使い分けがあってセンスが絡む部分はあるとは思うが、上記の知識があると色の選択で呆然と立ち尽くすことはなくなると思う。

デザインの苦手な人はこの辺を意識して練習してみると良いと思う。

次回以降でロゴの作成や写真の簡単なレタッチをまとめていけたらと思う。