【コピペ用】和風デザインに。和色同系色グラデーションのカラーコード19種232色まとめ

colores | Flickr

Webサイトでもブログでも、プレゼン資料でもチラシでも名刺でも、色付きの何かをオシャレに作ろうとしたら「同系色にまとめよ」という鉄則がある。「色は使いすぎるな」というやつだ。

同系色グラデーションフェチなぼくが今まで調べまくってきた経験からすると、同系色の見つけ方で一番早いのは、日本の伝統色 和色大辞典で良い感じの色を見つけ、0to255で"PICK A COLOR"にコピペしてグラデーションを取得すること。でもこの作業を何度もやるくらいなら、一気にまとめてしまった方が後々まで便利だと気付いた。

そこで本記事ではクリエイティブな作業の助けとして、よく使う同系色グラデーションのカラーコードをコピペできる形でひたすら羅列していく。基本的に和色から選んでいるので、日本人が眺めて落ち着く色も多くなっている。それではいきます。

青系色

青

#04062c

#070a4b

#0a0d6b

#0c118a

 

#1117b9

#222aeb

#6066f1

#9fa2f6

 

#bec0f9

#dddefc

#ecedfd

#fcfcff

 

空色

#04141b

#082a39

#0c4057

#115675

 

#1776a1

#1d97ce

#3bafe3

#76c7ec

 

#a3d9f2

#c1e6f6

#def2fa

#edf8fc

 

青碧（せいへき）

#0c1516

#172b2c

#234142

#2f5758

 

#3b6d6e

#4d8e8f

#6fb0b1

#9bc8c9

 

#c7e0e1

#ddeced

#e8f2f3

#f3f9f9

 

藍鼠（あいねず）

#0c0f10

#14181a

#222a2d

#2a3336

 

#38454a

#47575d

#5d727a

#7e949d

 

#a5b4ba

#cbd4d7

#e8ecee

#f2f4f5

 

紺桔梗（こんききょう）

#0a0b16

#0f1121

#191d39

#232951

 

#333c74

#4854a3

#6f7ac0

#9ea6d4

 

#c2c6e4

#d9dcee

#e5e7f4

#f1f2f9

 

紫系色

すみれ色

#0d0b14

#1d172a

#2c2240

#3b2e56

 

#4a3a6c

#685298

#8c78b6

#b1a4ce

 

#cec5e0

#e0dbec

#eae6f2

#f3f1f8

 

ぶどう色

#0e0810

#180e1c

#2b1932

#3f2449

 

#522f60

#6f4082

#9558ad

#b286c4

 

#cfb4da

#e5d6eb

#f3edf6

#fbf8fc

 

緑系色

緑

#07160a

#0c2310

#143c1b

#1d5627

 

#256f33

#3aaf50

#6fcf81

#a2e0ad

 

#c8edcf

#d5f1da

#e2f5e5

#eef9f0

 

翡翠色（ひすいいろ）

#040c09

#081913

#103227

#143f31

 

#20664f

#2c8d6d

#38b48b

#62ceaa

 

#96dec6

#bdeadb

#d6f2e9

#f0faf7

 

苔色（こけいろ）

#0e1204

#192007

#303c0c

#475812

 

#69821b

#8bac24

#acd42f

#c2df67

 

#d3e892

#e4f1bc

#eff7d8

#f5fae6

 

黃系色

黃（たんぽぽ色）

#110f00

#221d00

#443a00

#665700

 

#998200

#ccae00

#ffd900

#ffe344

 

#ffed88

#fff5bb

#fffadd

#fffcee

 

杏色（あんずいろ）

#190e01

#291602

#391f03

#593005

 

#894b08

#c96e0c

#f18717

#f4a047

 

#f8c187

#fbdab7

#fef3e7

#fffbf7

 

茶系色

黄櫨染（こうろぜん）

#0a0502

#180b05

#261208

#35180b

 

#512610

#89401c

#c25a27

#d97443

 

#e1946d

#edbda6

#f6ddd0

#fbf1ed

 

紅鳶（べにとび）

#090404

#150a09

#2e1613

#3a1b18

 

#46211c

#6a322b

#9a493f

#b95e53

 

#cc8b83

#e0b9b4

#efdad8

#f9f1f0

 

赤系色

血赤色

#2b0503

#3a0705

#4a0906

#6a0d09

 

#99120c

#d81a12

#ef453e

#f4827d

 

#f9bebb

#fcdcdb

#fdebea

#fffafa

 

薔薇色（ばらいろ）

#190307

#28050b

#37070f

#550b16

 

#821122

#bf1932

#e32744

#e9546b

 

#f1909f

#f8ccd3

#fceaed

#fefafa

 

ピンク系色

ピンク

#fb03f2

#fd23f4

#fd45f6

#fd67f8

 

#fe77f8

#fe88f9

#fe99fa

#feaafb

 

#febbfc

#fecbfd

#ffdcfd

#ffedfe

 

暗紅色

#090407

#150911

#2d1324

#451e36

 

#682d53

#8c3c6f

#b65693

#cb85b1

 

#dfb5d0

#eed8e6

#f3e4ee

#f9f0f5

 

グレースケール

#000

#111

#222

#333

 

#444

#555

#666

#777

 

#888

#999

#aaa

#bbb

 

#ccc

#ddd

#eee

#fff

 

多すぎても迷い、少なすぎても使いづらいということで、絶妙な232色を選んだつもりだ。デザイン活動の補助として、ぜひ作業効率アップに活用していただきたい。

それぞれの色のより細かいグラデーションが欲しい場合は、その色のコードを0to255のPICK A COLORにコピペすればグラデーションが取得できる。

関連記事：