簪さんはお休みしたい ーゆっくり生きログー

いろいろ。時々リアル。日記なのに不定期投稿(しばらく毎日)

【ブログデザインにも】色の相性・組み合わせについてほとんど自分のためにまとめてみました


やっ

 

 

治ったと思ったら治ってなかった!

もうやだあ。。。

 

 

日が合わないから日曜日病院いこ。。。

 

空いてるかなあ。。。 

 

 

さてさて

今回は題の通り

「色の組み合わせ」のお話です

 

別にイラストを書いたり

デザインをしたりするわけじゃないんだけど

 

お洋服を合わせるときや

それこそ見やすいブログをデザインするときにこーゆうの使うだろうなーって

思ったので

ちょっとどんなものか見てみようと思ったの

 

あと

個人的にアプリのデザインに

活用したいし

 

 

専門の人たちにとっては基礎中の基礎だという

トーンや色の相性の法則について調べてみようと思うよー

 

 

それではいってみよー!

 

あ、3色はまだ個人的によくわかんなかったので

とりあえず2色の組み合わせから

 


 

それでは

まずそもそもトーン(色調)とは?

 

色の三属性「色相」、「明度」、「彩度」

のうち明度と彩度がおんなじグループのこと

なんだって

 

参考に目でわかりやすくまとめられたグラフを

以下に示します

 

f:id:zash01105:20180507014211g:plain

(引用元:https://iro-color.com/colorchart/tone/)

 

[引用サイト]

iro-color.com

 

 

次に実際の組み合わせ方法をまとめてみた

組み合わせの例として

色相環の図を用いるよ 

 

 

参考画像の作成には

以下のサイトを利用してます 

 

[Color Supply]

http://colorsupplyyy.com/app/

 

 

同一色相配色

同じ色相内で明度彩度を変化させたものの組み合わせ

 

類似色相配色

似た色相同士(色相環で30~60の角度と言われているらしい)の組み合わせ

 

f:id:zash01105:20180509005027p:plain

 

対象色相配色

色相差の大きいもの同士の組み合わせ

 

f:id:zash01105:20180509005929p:plain

その中でも補色( 色相環の向かい合わせの色)同士の組み合わせを

補色色相配色という

 

f:id:zash01105:20180509010055p:plain

 

この組み合わせ方法は

メリハリが出てどうやらいいらしい

 

同一トーン配色

色相は異なるがトーンが似ているもの同士の組み合わせ

トーンが同じなのでまとまりが出るらしい

 

f:id:zash01105:20180509012636p:plain

 

類似トーン配色

隣り合うトーン同士の組み合わせ

トーンが似ているので

すごく合うらしい

 

f:id:zash01105:20180509014026p:plain

 

 

 

対象トーン配色

トーンの変化を大きいもの同士の組み合わせ

 

んでんで

その大きいもの同士の

決め方には

3通りの方法があるんだって

 

明度が大きく差があるもの同士

f:id:zash01105:20180509185211j:plain

 

彩度に大きく差があるもの同士

f:id:zash01105:20180509185228j:plain

 

明度・彩度ともに大きく差があるもの同士
 

f:id:zash01105:20180509185241j:plain

 

  


 

 

とりあえずこんな感じ?

 

すごく難しい。。。

 

普段多少気をつけるくらいで

色のことをすごい深いところまでは

見てなかったから

新鮮でいいね

 

3色行くまでに

2色の使い方に慣れたいな。。。

 

 

今日は以上

 

//一言

お酒が飲めない。。。 

 

 

 

 

 

 

 

 

 

 

 


スポンサーリンク