![見出し画像](https://assets.st-note.com/production/uploads/images/144242162/rectangle_large_type_2_12b55d437a8b868adffe6a64d0b4a307.jpeg?width=800)
色の基礎知識
色の三属性
色相・彩度・明度について
![](https://assets.st-note.com/img/1717310629298-CCoCStjMry.jpg?width=800)
RGBとCMYK
主にデバイスモニターで扱うデータはRGB、印刷物はCMYKで制作
![](https://assets.st-note.com/img/1717310674755-3fuDmI2aH0.jpg?width=800)
カラーコード
Webページ上で色を指定するためのコード
「#」と6桁の16進数(0~F)で表記され、R・G・Bを2桁ずつで表す
0~Fの順で明るい色になる #000000は黒 #ffffffは白
webデザインの色指定は基本的にカラーコードで指定する事が多いが色の名前の英語表記(redやpinkなど)や、RGB「rgb」や、RGBに不透明度を足した「rgba」で指定する事もできる
![](https://assets.st-note.com/img/1718947883825-RTMonaaC5k.jpg?width=800)
色の組み合わせ カラーリング
色相・色味で組み合わせを考える
![](https://assets.st-note.com/img/1717310750122-taWjDNIUve.jpg?width=800)
色味の組み合わせ以外にも
彩度で組み合わせを考える [Saturation]
■彩度の高い色同士の組み合わせの特徴
インパクト・コントラストの強い・目立つ・派手 etc…
■彩度の低い色同士の組み合わせの特徴
落ち着いた・シック・上品・高級感・地味 etc…
明度で組み合わせを考える [Brightness]
■明度差が大きい
コントラストが強くはっきりくっきりした印象
■明度差が少ない
コントラストが少なく境界の違いが分かりにくい
https://color.adobe.com/ja/create/color-wheel
この記事が気に入ったらサポートをしてみませんか?