コニファ・ロゴ

ツール集:グラデーションの中間色のステップ数を変え、色コードを取得

webデザインでは、2つの色コードから作成したグラデーションの中間色の色コードを取得して利用することがよくあります。Photoshopのスポイトツールのようなもので取得する方法もありますが、結構手間がかかるので、これがブラウザ表示でできれば作業を軽便におこなえます。

サンプル解説:サンプルの左側にある2つの入力欄に色コードを入力します。入力欄の左側の円にその色が反映します。次に、2つの入力欄の間にあるスライダーを動かしてステップ数を決めます。右側にそのスッテプ数に合わせた段階の色と色コードが表示されるので、色を決め、その色コードをコピーします。ステップ数は1から25までになります。

サンプル

8 steps
 #0ebeff
 #29b0f7
 #44a2ee
 #5e95e6
 #7987dd
 #9479d5
 #af6bcc
 #c95ec4
 #e450bb
 #ff42b3

 

戻るボタン