ブログの色指定に使われていますカラーコードは、R（赤）G（緑）B（青）の光の三原色を 0〜9 と A〜F の16進数6桁で表したもので、#000000（黒）〜 #FFFFFF（白）までの 16,777,216色 を表示することが出来ます。
この16進数のカラーコードの数値を調整して色を明るくしたり暗くするには、R（赤）の数値、G（緑）の数値、B（青）の数値に同じ数を足したり、引いたりすれば、色相を変えることなく明度を変えることができます。
※ 16進数：0、1、2、3、4、5、6、7、8、9、a、b、c、d、e、f、の基数を16とした数値。
たとえば上記見本の #339966 の色を少し明るくするには #44aa77、#55bb88、というように同じ数を R（赤）、G（緑）、B（青）、それぞれの数値に足して #FFFFFF（白）に近づけるように上げていきます。
少し暗くするには #228855、#117744、と同じ数を引いて #000000（黒）に近づけるように下げていきます。
| |
|
|
|
|
|
|
| #000000 |
#117744 |
#228855 |
#339966 |
#44aa77 |
#55bb88 |
#FFFFFF |
下記のような文字色によく使われます基本色の場合は MAX（最大値）の FF と MIN（最小値）の 00 との組み合わせになりますので、色相のないグレースケールに置き換えて考えますと自然に調整ができます。
基本色：白と黒を除いた FF と 00 の組合せの6色
| Red |
Lime |
Blue |
Yellow |
Aqua |
Fuchsia |
| #FF0000 |
#00FF00 |
#0000FF |
#FFFF00 |
#00FFFF |
#FF00FF |
グレースケール：色相のない黒から白の明度のものさし
| |
|
|
|
|
|
| #000000 |
#333333 |
#666666 |
#999999 |
#cccccc |
#FFFFFF |
#FF0000 の色を明るくしたい場合は #000000（黒）の位置に置き換え、Ｒ は FF で MAX なので、G とB の数値を #FFFFFF（白） に近づけるように上げていきます。
| |
|
|
|
|
|
| #FF0000 |
#FF3333 |
#FF6666 |
#FF9999 |
#FFcccc |
#FFFFFF |
#FF0000 の色を暗くしたい場合は #FFFFFF（白）の位置に置き換え、G と B は 00 で MIN なので、R の数値を #000000（黒） に近づけるように下げていきます。
| |
|
|
|
|
|
| #000000 |
#330000 |
#660000 |
#990000 |
#cc0000 |
#FF0000 |
いかがでしたでしょうか？16進数のカラーコードの仕組みがわかりますと、文字色なんかの簡単な色の調整は出来るようになりますので、覚えておきますと便利かと思います。
複雑な数値の組み合わせのカラーコードの場合はこちらのツールがとても便利です。
※上記ツールのご利用につきましては、利用者の自己責任にてお願いします。
アフィリエイトの始め方 (3)
この記事へのコメント