« 世界中のどこからでもラジコンを遠隔操作 - JokerRacer | メイン | Ubuntu Hardy に ImageMagick と RMagick をインストールする »

2009/04/23

HTMLカラーコードで表された色を濃く(暗く)する Javascript

Posted in Web, javascript at 1:47:36 by ジュンヤ

任意に指定された HTML カラーコードで表された色と、それを少し濃くした色とのペアを取得するという必要にせまられた。これを実現する Javascript のコードを探したのですが、適当なものがみつからなかったので自分で書いてみました。

エントリー末尾の Javascript コードを読み込み、

darken(’ff0000′, 0.8)

のように darken 関数を呼んでください。2つ目の引数は濃くする度合いで、1に近いほど濃くする度合いは弱く、0に近いほど度合いが強くなります。

以下、実際どのように濃くなるかの例です。

　 ff0000
　 darken(’ff0000′, 0.8) = cc0000

　 ffccff
　 darken(’ffccff’, 0.8) = cca3cc

» Miscellaneous : True Color Darkening and Lightening / The JavaScript Source

のコードを参考にしました。

上記は逆数を取ったりとちょっとややこしいことをしているのですが、#ff0000 のような原色をうまく変換してくれなかったので、

» Darken and lighten color? - Usenet Forums

の

To lighten, increase RGB values by 10% each. To darken, decrease RGB values by
10% each. Maybe replace 10 with whatever the “certain amount” is.

(RGBの各色を10%ずつ増やせば色を薄く、10%ずつ減らせば色を濃くできる)

という発言を参考にして書き直しました。

不備があったり、もっと良い方法がありましたら、コメントなどでお知らせください。

Webカテゴリの最近の記事 　　　　　　　　　　　　

コメント・トラックバック

この記事のトラックバックURL

コメントを残す