![彩度とは?色を操って思い通りのテイストを表現しようのアイキャッチ画像](https://images.microcms-assets.io/assets/849933361e3447368c1f885948b087dc/2e7a610e54d84b77ac782721b8a687b9/Group%20348.png?w=1200&fm=webp)
デザイン
更新日: 2024/3/1
彩度とは?色を操って思い通りのテイストを表現しよう
![character_balloon](/media/character/pink_normal_left.png)
イエローちゃん教えてほしいのー!
ピンクちゃんどうしたのー?
![character_balloon](/media/character/yellow_normal_right.png)
![character_balloon](/media/character/pink_normal_left.png)
彩度ってどういう意味だったかしら?
あー彩度かぁー
![character_balloon](/media/character/yellow_normal_right.png)
じゃあ今日は彩度について説明するね!
![character_balloon](/media/character/yellow_normal_right.png)
彩度とは?
![彩度とは?色を操って思い通りのテイストを表現しようの画像_2枚目](https://images.microcms-assets.io/assets/849933361e3447368c1f885948b087dc/d1ec4d5076064f579d25da67923d33c8/IMG_2663.png?w=1200&fm=webp)
![character_balloon](/media/character/yellow_normal_left.png)
彩度とは、色の鮮やかさを指す言葉なんだよー
![character_balloon](/media/character/yellow_normal_left.png)
色の強さやあざやかさの度合いを彩度で表せるんだ
![character_balloon](/media/character/yellow_normal_left.png)
彩度が高いほど目立ちやすくて、彩度が低いほどくすんだ色味になるよー
![character_balloon](/media/character/yellow_normal_left.png)
彩度は、色の三属性のひとつだよ!
色の三属性について知ろう!
![character_balloon](/media/character/yellow_normal_left.png)
色彩を扱えれば、テイストやイメージは変えないまま雰囲気を変えることができるよね
![character_balloon](/media/character/yellow_normal_left.png)
色を操るためには色の三属性を理解することが重要だよ!
![character_balloon](/media/character/yellow_normal_left.png)
彩度は色の三属性のひとつなんだけど、色の三属性それぞれについて説明していくね
色の三属性1.色相ってなに?
![彩度とは?色を操って思い通りのテイストを表現しようの画像_6枚目](https://images.microcms-assets.io/assets/849933361e3447368c1f885948b087dc/b7ed80cdcd1f48a2a06da9bfa17dd8a4/59D961B6-3DE1-45F6-BB2E-0ADB923DF20C.png?w=1200&fm=webp)
![character_balloon](/media/character/yellow_normal_left.png)
色相は、色の相違のことなんだよ
![character_balloon](/media/character/yellow_normal_left.png)
赤、黄色、青はわかりやすいと思うけど、緑やオレンジなど、色にはそれぞれ特徴的に際立った色みがあるよねー
![character_balloon](/media/character/yellow_normal_left.png)
実は、色は人間が感知できる光の波長で、この波長が異なるから様々な色を認識できるんだよ
![character_balloon](/media/character/yellow_normal_left.png)
この波長の相違が、色相のことなんだ
![character_balloon](/media/character/yellow_normal_left.png)
つまり、色相を変化させると色自体がどんどん変化していくよー
色の三属性2.明度ってなに?
![彩度とは?色を操って思い通りのテイストを表現しようの画像_8枚目](https://images.microcms-assets.io/assets/849933361e3447368c1f885948b087dc/a450a6b2b70f4978aaacabfed86bef06/E413DB37-F981-4DA3-9684-0082C9AE4069.png?w=1200&fm=webp)
![character_balloon](/media/character/yellow_normal_left.png)
明度は、その名の通り色の明るさのことだよ
![character_balloon](/media/character/yellow_normal_left.png)
明るいと白に近づいていって、暗いと黒に近づいていくんだよねー
![character_balloon](/media/character/yellow_normal_left.png)
明るいことを明度が高い、暗いことを明度が低いっていうんだ
![character_balloon](/media/character/yellow_normal_left.png)
明度が高いと柔らかい印象に、明度が低いと暗い印象になるよー
色の三属性3.彩度ってなに?
![彩度とは?色を操って思い通りのテイストを表現しようの画像_10枚目](https://images.microcms-assets.io/assets/849933361e3447368c1f885948b087dc/021aa60bcd794d72a7a7c09cb0b634e3/DEEBCAC6-0375-4454-8752-A09E133BCEAC.png?w=1200&fm=webp)
![character_balloon](/media/character/yellow_normal_left.png)
彩度とは色の鮮やかさの度合いだよ
![character_balloon](/media/character/yellow_normal_left.png)
彩度が高い状態は、色味が強くて鮮やかなビビッドな色合いになるんだ
![character_balloon](/media/character/yellow_normal_left.png)
彩度が低い状態だと、くすんだ色味で地味な色合いになっていくんだよねー
![character_balloon](/media/character/yellow_normal_left.png)
派手で色の特徴を目立たせたいときは彩度を高く、無味で味気ない印象にしたいときは彩度を低くすると雰囲気が出るよ!
彩度の数値の意味は?何を表しているの?
![彩度とは?色を操って思い通りのテイストを表現しようの画像_12枚目](https://images.microcms-assets.io/assets/849933361e3447368c1f885948b087dc/8c12a42ac8aa45ee81070ac14d9ea564/A58B7448-EC9F-4932-B897-9278257611B4.png?w=1200&fm=webp)
![character_balloon](/media/character/yellow_normal_left.png)
彩度の数値は、色空間における中心からの距離を表しているよ
![character_balloon](/media/character/yellow_normal_left.png)
中心から離れるほど、つまり数値が大きくなるほど彩度が高い状態で、色味が強くなるんだよねー
![character_balloon](/media/character/yellow_normal_left.png)
赤青黄色の原色の純色で最大値の100となり、白黒灰色など無彩色で0になるよ
![character_balloon](/media/character/yellow_normal_left.png)
彩度を上げてと言われたら色味を強く、彩度を下げてと言われたら色味を抑えてという意味合いになるんだ
彩度の役割ってなんだろう?
![character_balloon](/media/character/yellow_normal_left.png)
色の三属性それぞれを操作することで色合いを操ることができるんだけど、三属性全てのバランスを整えないと理想の色味にならないよ
![character_balloon](/media/character/yellow_normal_left.png)
色相が決まったら、彩度と明度を調整することでコンテンツの雰囲気を作り出すことができるんだよねー
![character_balloon](/media/character/yellow_normal_left.png)
イメージしづらいと思うから、彩度が高い事例と低い事例を紹介するね
彩度が高いWebサイトの事例.コカ・コーラ
![彩度とは?色を操って思い通りのテイストを表現しようの画像_16枚目](https://images.microcms-assets.io/assets/849933361e3447368c1f885948b087dc/6afe3b5c3c4a434294d84b7fe3d063ba/image%20100.png?w=1200&fm=webp)
![character_balloon](/media/character/yellow_normal_left.png)
コカ・コ-ラのWebサイトは、彩度が高いわかりやすい事例だよ!
![character_balloon](/media/character/yellow_normal_left.png)
コカ・コーラはパッケージもパッと鮮やかな赤が特徴的だよね
![character_balloon](/media/character/yellow_normal_left.png)
飲料部分は濃茶から黒に近い色合いだから、彩度が高い赤がより映えるんだ
![character_balloon](/media/character/yellow_normal_left.png)
製品イメージとも合っていて、消費者の印象に残る上手な彩度が高い例なんだよー
彩度が低いWebサイトの事例.黒川温泉郷
![彩度とは?色を操って思い通りのテイストを表現しようの画像_18枚目](https://images.microcms-assets.io/assets/849933361e3447368c1f885948b087dc/bc73cdb5b94b4a859d1950f0148d8131/image%20101.png?w=1200&fm=webp)
![character_balloon](/media/character/yellow_normal_left.png)
黒川温泉郷のイメージサイトは、基本色は黒と白で構成されている彩度が低いサイトだよー
![character_balloon](/media/character/yellow_normal_left.png)
写真も暗い色合いでマスクされていて彩度が低い状態を意識的に作り出しているんだよね
![character_balloon](/media/character/yellow_normal_left.png)
音楽とともに、雰囲気を味わえる効果的な演出が美しい彩度が低い例なんだ
![character_balloon](/media/character/yellow_normal_left.png)
最後に、彩度についてまとめるね
まとめ
◆彩度とは色の三属性のひとつで、鮮やかさの尺度
◆彩度を高くすると色味が強くビビッドな色合いになる
◆彩度を低くするとくすんで地味な色合いになる
![character_balloon](/media/character/yellow_normal_left.png)
彩度についてわかってきたかな?
色を操るのが楽しくなりそうだわ!
![character_balloon](/media/character/pink_normal_right.png)
ありがとうイエローちゃん
![character_balloon](/media/character/pink_normal_right.png)
![character_balloon](/media/character/yellow_normal_left.png)
好みのテイストを表現できるようになるといいねー
![character_balloon](/media/character/yellow_writer.png)
イエロー
インフルエンサーマーケティングやSNSマーケティングな女の子。まだまだ勉強中なので、これから他のマーケティング手法も頑張って勉強中。