「0to255」同系色の濃淡をカラーコード付の色見本でグラデーション表示する配色ツール ＋ぷちカスタマイズ日記＋

同系色の濃淡をカラーコード付の色見本でグラデーション表示する配色ツール「0to255」を紹介します。

---

0to255 は、2年程前から仕事で使っているオンライン web ツールで、クライアントさんから微妙な色の濃淡調整のご要望があった時なんかに、とてもお世話になっています。

---

0 to 255（0から255）とは色の明度の数値のことで、web デザイナーが色合いと任意の色に基づいた同系色の濃淡を簡単に見つけるために開発された、シンプルでCOOLなデザインの配色ツールです。
前回紹介しました、ColorZilla と合わせて使いますと、ストレスなく作業を進めることができますので、おすすめです。

---

海外のツールですが、使い方はとても簡単で「PICK A COLOR」を押してベースとなる色のカラーコードを入力して「Pick color」を押すだけで、ベースの色を中心に明るい色と暗い色のカラーコード付の色見本がグラデーションで表示され、最上部と右側に白（#FFF）、最下部と左側に黒（#000）が配置されます。 表示された色見本の上にマウスカーソルを置きますと、階層（+ - 数値）と明度（%数値）が表示され、ベースの色とマウスカーソルを置いた色との比較がでる「Click to copy」という小さな窓が表示されます。
色見本をクリックするだけで、# を除いたカラーコードがクリップボードに記憶されるのも、うれしい機能です。

---

いかがでしたでしょうか？「あと少し暗くしたい」「ちょっと明るくしたい」という色の微調整の他、マウスを乗せたときに色を明るくしたり、ボタンのボーダーを少し暗くしたい場合なんかの色指定に役に立つと思います。
また、CSS 3 で shadow や gradient などの色指定にも使えると思いますので、ぜひ一度お試しください。

---

※上記ツールのご利用につきましては、利用者の自己責任にてお願いします。

---