Embedded Files
> Back
スタイリッシュなサイトやスライドに仕上がる色パレットを得るために，HSV 表色モデル (色相 Hue と彩度 Saturation と明度 Value から成る表色系) を扱えるあなたのお気に入りのツール (例) を準備します．
スタイリッシュなサイトやスライドに仕上がる色パレットを得るために，HSV 表色モデル (色相 Hue と彩度 Saturation と明度 Value から成る表色系) を扱えるあなたのお気に入りのツール (例) を準備します．
発信したいメッセージやコンセプトを連想させる色 H4∈[0, 360) (°)，S4＝(0, 100] (％)，V4∈[10, 90] (％) を選び，これを基本色とよびます (4 は単に添え字です)．もし極端に 0 または 100 に近い V4 を選ぶと，以降において明度に関するバリエーションを付けられなくなることに，注意してください．以降では，例えばメディカルを連想させる (H4, S4, V4) ＝ (198, 100, 74) すなわち (R, G, B) ＝ (0, 133, 191) を選んだとします．
発信したいメッセージやコンセプトを連想させる色 H4∈[0, 360) (°)，S4＝(0, 100] (％)，V4∈[10, 90] (％) を選び，これを基本色とよびます (4 は単に添え字です)．もし極端に 0 または 100 に近い V4 を選ぶと，以降において明度に関するバリエーションを付けられなくなることに，注意してください．以降では，例えばメディカルを連想させる (H4, S4, V4) ＝ (198, 100, 74) すなわち (R, G, B) ＝ (0, 133, 191) を選んだとします．
H1＝H4，S1＝S4，V1＝100 により得られる (H1, S1, V1)，例えば (H4, S4, 100) ＝ (198, 100, 100) すなわち (R, G, B) ＝ (0, 178, 255) は，基本色と同系の最も明るい色です．
H1＝H4，S1＝S4，V1＝100 により得られる (H1, S1, V1)，例えば (H4, S4, 100) ＝ (198, 100, 100) すなわち (R, G, B) ＝ (0, 178, 255) は，基本色と同系の最も明るい色です．
H2＝H4，S2＝S4，V2＝100－(100－V4)/3 により得られる (H2, S2, V2)，例えば (H4, S4, 100－(100－V4)/3) ＝ (198, 100, 91) すなわち (R, G, B) ＝ (0, 162, 232) は，最も明るい色よりも少しだけ，基本色に近い色です．
H2＝H4，S2＝S4，V2＝100－(100－V4)/3 により得られる (H2, S2, V2)，例えば (H4, S4, 100－(100－V4)/3) ＝ (198, 100, 91) すなわち (R, G, B) ＝ (0, 162, 232) は，最も明るい色よりも少しだけ，基本色に近い色です．
H3＝H4，S3＝S4，V3＝100－(100－V4)×2/3 により得られる (H3, S3, V3)，例えば (H4, S4, 100－(100－V4)×2/3) ＝ (198, 100, 83) すなわち (R, G, B) ＝ (0, 148, 211) は，基本色よりも少しだけ，最も明るい色に近い色です．
H3＝H4，S3＝S4，V3＝100－(100－V4)×2/3 により得られる (H3, S3, V3)，例えば (H4, S4, 100－(100－V4)×2/3) ＝ (198, 100, 83) すなわち (R, G, B) ＝ (0, 148, 211) は，基本色よりも少しだけ，最も明るい色に近い色です．
H5＝H4，S5＝S4，V5＝V4×2/3 により得られる (H5, S5, V5)，例えば (H4, S4, V4×2/3) ＝ (198, 100, 49) すなわち (R, G, B) ＝ (0, 87, 124) は，基本色よりも少しだけ，最も暗い色に近い色です．
H5＝H4，S5＝S4，V5＝V4×2/3 により得られる (H5, S5, V5)，例えば (H4, S4, V4×2/3) ＝ (198, 100, 49) すなわち (R, G, B) ＝ (0, 87, 124) は，基本色よりも少しだけ，最も暗い色に近い色です．
H6＝H4，S6＝S4，V6＝V4/3 により得られる (H6, S6, V6)，例えば (H4，S4，V4/3) ＝ (198, 100, 25) すなわち (R, G, B) ＝ (0, 44, 63) は，最も暗い色よりも少しだけ，基本色に近い色です．
H6＝H4，S6＝S4，V6＝V4/3 により得られる (H6, S6, V6)，例えば (H4，S4，V4/3) ＝ (198, 100, 25) すなわち (R, G, B) ＝ (0, 44, 63) は，最も暗い色よりも少しだけ，基本色に近い色です．
H7＝H4，S7＝S4，V7＝0 により得られる (H7, S7, V7)，例えば (H4, S4, 0) ＝ (198, 100, 0) すなわち (R, G, B) ＝ (0, 0, 0) は，基本色と同系の最も暗い色であり，常に純黒です．
H7＝H4，S7＝S4，V7＝0 により得られる (H7, S7, V7)，例えば (H4, S4, 0) ＝ (198, 100, 0) すなわち (R, G, B) ＝ (0, 0, 0) は，基本色と同系の最も暗い色であり，常に純黒です．
H8＝(H4＋180) mod 360，S8＝S4，V8＝V4 により得られる (H8, S8, V8)，例えば ((H4＋180) mod 360, S4, V4) ＝ (18, 100, 74) すなわち (R, G, B) ＝ (188, 56, 0) は，色相が基本色のそれから最も遠い色です．
H8＝(H4＋180) mod 360，S8＝S4，V8＝V4 により得られる (H8, S8, V8)，例えば ((H4＋180) mod 360, S4, V4) ＝ (18, 100, 74) すなわち (R, G, B) ＝ (188, 56, 0) は，色相が基本色のそれから最も遠い色です．
あなたの嗜好に合わせて多少は修正しても構いません．例えば (H1, S1, V1) を (198, 100, 100) から (195, 80, 100) すなわち (R, G, B) ＝ (51, 204, 255) へ，また (H8, S8, V8) を (18, 100, 74) から (0, 100, 80) すなわち (R, G, B) ＝ (204, 0, 0) へ変更してみます．
あなたの嗜好に合わせて多少は修正しても構いません．例えば (H1, S1, V1) を (198, 100, 100) から (195, 80, 100) すなわち (R, G, B) ＝ (51, 204, 255) へ，また (H8, S8, V8) を (18, 100, 74) から (0, 100, 80) すなわち (R, G, B) ＝ (204, 0, 0) へ変更してみます．
以上の要領で整えた 8 色および白色 (H0, S0, V0) ＝ (0, 0, 100) すなわち (R, G, B) ＝ (255, 255, 255) を用いて，ウェブサイトやスライドを制作します．
以上の要領で整えた 8 色および白色 (H0, S0, V0) ＝ (0, 0, 100) すなわち (R, G, B) ＝ (255, 255, 255) を用いて，ウェブサイトやスライドを制作します．
Google Sites
Report abuse