初心者大歓迎！HTMLを使って一緒にHP作成してみませんか？

　「前回でカラーコードのしくみはわかったかしら？
　　　　今回は、パソコンに最初から入っているペイントソフトを使って、
　　　　自分の使いたい色のコードを計算する方法をやるわね。」


　「計算かぁ・・・う〜ん苦手・・・。」


　「そんなに難しくないから、気楽にね。
　　　　まずペイントソフトを起動しましょう。

　　　　スタート　→　すべてのプログラム　→　アクセサリ　→　ペイント

　　　　これで起動できるわね。」


　「はい！できました☆」

　「上のような画面が開いたわね？
　　　画面上のメニューの　色　→　色の編集　をクリック。」

　「そうするとこんなふうに新しいウインドウが開いたわね。
　　　　下の　色の作成ボタン　をクリック。」

　「そうするとウインドウが右に広がって
　　　　いろんな色のグラデーションが出てきたでしょう？」


　「はい。」


　「このグラデーションの中から
　　　　自分の使いたい色を選んで。
　　　　さらに右の縦のグラデーションで明るさを選べるの。」

　「赤枠の部分に選んだ色が表示されてるわね。
　　　　これでよければ、一番右側の数字を見て。」

　「上から赤、緑、青ってならんでるでしょう？
　　　　この場合だと

　　　　赤　→　172
　　　　緑　→　115
　　　　青　→　215

　　　　になってるわね。
　　　　この数字は、色の強さを　0〜255　までの数字であらわしたものなの。」


　「なるほど。
　　　　これを2桁の番号に置き換えていけばいいんですね？」


　「そのとおり☆」


　「赤は172だから、172番目の番号は・・・00、01、02、03・・・。」


　「ふふふ。最初から数えていくつもり？
　　　　20、30くらいなら数えられても、3桁になるとキツイわね。
　　　　ちゃんと式があるのよ。割り算はできるわね？」


　「も、もちろん・・・かんたん式なら。」


　「それじゃあ、3つの数字をそれぞれ
　　　　16で割って余りを出して。
　　　　小数点以下まで出しちゃだめよ。」


　「16で割って余り・・・え〜っと

　　　　赤　→　172　÷　16　=　10　あまり　12
　　　　緑　→　115　÷　16　=　7　あまり　3
　　　　青　→　215　÷　16　=　13　あまり　7

　　　　になります！」


　「よくできました☆
　　　　今度はその答えと余りの中で、
　　　　10以上の数字をアルファベットに置き換える　のよ。
　　　　10=A、11=B、12=C、13=D、14=E　15=F　になるわね。
　　　　0〜9までは数字のままね。」


　「なるほど☆
　　　　じゃあ赤はAとC、緑は7と3、青はDと7、ですね？」


　「そう。これをそのままカラーコードに当てはめると・・・
　　　　#AC73D7　ね。
　　　　これがさっき選んだ色のカラーコードになるの。」


　「おお〜！ちゃんとカラーコードの形になってる！」


　「実際に背景の色に使ってみると・・・。」

　「ちゃんと同じ色になったでしょ。」


　「ホントだ！計算って聞くとややこしい感じがしたけど、
　　　　そんなに難しくなかったですね。」


　「そうね。実際は　カラーチャート　を見た方が早いんだけど
　　　　こんなやり方もある、というのを覚えておいてね☆」





↑ページのTOPへ

#RRGGBBってなに？ <<<　前のさるぢえへ戻る

属性と属性値 次のさるぢえへ進む　>>>

ページの背景に色をつけよう <<<　関連ページへ戻る

カラーチャート よく使うカラーコード集

サルでもわかる？かんたんHTML　トップページ 　>>>　さるぢえ集 　>>>　カラーコードの計算方法