【絶対知っているべき!?】色の法則
はい、どうも！
フリーランスエンジニアの南だいすけです！
今回は【絶対知っているべき!?】色の法則について解説していきます！
今週から夏休みということで私はWebの勉強を中心に進めているのですが、
「これはみんな知っておくべき！」と思ったので、アウトプットも兼ねて話していきたいと思います！
ちなみに現在読んでいる本はこちらです！
＼本はこちら↓／
こちらの本は現在Webフロント(HTML・CSS)の技術書で、
めちゃくちゃ売れている一冊です！
エンジニア仲間が紹介してくれて実際に買ってみましたが、
副業でプログラミングをしてみたいという方はもちろん、
Webのデザインについて知りたい！とか、
サムネを作っているという方もおすすめの一冊です。
プログラミングは今後も市場価値が高まっていくので、
買って損はないと思います！
では早速いきましょう！
色の性質を理解しよう
はじめに色についての基礎を話していきます。
本ではカラーコードだったりRGB値についても書かれていましたが、今回は割愛します。
まず色は以下の３つの要素で成り立っています。
・色相
・明度
・彩度
ひとつひとつ解説していきます！
・色相
赤・青・緑のような色の名前のことを指します。
似た色を円にしてまとめたものを色相環と言います
また反対にある色を補色といい、隣の色を類似色相といいます。
・明度
明度は色の明るさのことです。
明度が高いと白に近づき、明るく爽快な印象になり、
明度が低いと黒に近づき、暗く落ち着いた印象になります。
・彩度
彩度は色の鮮やかさです。
彩度が高いと鮮やかで華やかな印象になり、
彩度が低いと渋く大人っぽい印象になります。
また暖色寒色という言葉があるように、
色で温度感を表現することもできます。
暖色は赤やオレンジ、ブラウンといった色で暖かさを、
寒色は青やネイビーといった色で涼しげな印象を与えます。
中性色は緑や紫などといった色で温度を感じない色で、
無彩色は白、黒、グレーといった色味がない色です。
また色ひとつひとつにももちろんイメージがあるので、
こちらを参考にしてみてください！
色の配分は超大事！
次に色の配分についてです。
こちらはベースカラー・メインカラー・アクセントカラーの三色で構成するといいです。
また内訳と詳細はこんな感じです。
・ベースカラー
７０％がこの色。
デザインの基盤となる色でWebサイトでいう背景色になるため、
コンテンツの邪魔にならないようにシンプルな色にすること。
・メインカラー
２５％がこの色。
そのコンテンツを印象付ける色で、一番みられる色。
・アクセントカラー
５％がこの色。
デザインの引き締めやメリハリのための色。
ボタンなど目立たせたい時もこの色を使う。
こちらのバランスが大切なので意識していきましょう！
今回は色について書いてきましたが、
HTML・CSSについても非常にわかりやすく、
CSSについてはチートシートもダウンロードできるので非常におすすめです！
興味がある方はぜひチェックしてみてください！
さいごに
最後まで読んでいただいてありがとうございました！
少しでも読んでくださった方の力になれたのなら幸いです。
本来なら自分のやっている情報商材の案内などをするところなのでしょうけど、私はやっていないのでYouTubeチャンネルとTwitterの紹介させてください！
YouTube:
Twitter:
これからも役立つような情報を発信していきますので、
気に入って頂けたらスキやフォローをしていただけると嬉しいです！
コメントも大歓迎です！お待ちしています！
ではまた次の記事でお会いしましょう！