ボタン自動作成｜カラーサイト.com

左のカラーピッカーからボタンの背景色を選ぶことができます。
パレットをクリックして色を選択する以外にも、RGBのカラーコードを直接入力したり、HSVを値を入力することでも指定することができます。

フォントサイズや、ボタンの大きさ、線幅などを変更できます。
数値の入力はレンジ入力でバーを動かすことでも変更できます。

フォントサイズ	8px～96pxの間でボタンの文字の、フォントサイズを指定することが出来ます。
ボタン横幅	40px～300pxの間で、ボタンの横幅を指定することが出来ます。
ボタン縦幅	30px～200pxの間で、ボタンの縦幅を指定することが出来ます。ボタンの横幅と縦幅は、線の幅を含めて指定したサイズになります。
線幅	0px～20pxの間でボタンの線の幅を指定することができます。 0pxのときは線を表示しません。
角丸半径	0px～100pxの間で角丸の半径を指定することができます。ボタンの横幅もしくは縦幅の半分以上を超えた場合は、その値になります。
グラデーション	「なし」の場合は、指定された色で塗られます。「あり」の場合は、指定された色より明るい色から指定された色までのグラデーションで塗られます。「反転」を選ぶをグラデーションの色が反対になります。
ボタンテキスト	ボタンに表示する文字を入力します。文字の色は背景色によって、白もしくは黒で表示されます。また複数行の入力も可能です。文字がボタンの横幅以上になる場合は、ボタンの横幅のサイズに横方向に縮小されます。

文字のシャドウや内側のシャドウなど細かい設定をつけることができます。

文字シャドウ	「あり」にすると文字の下に1pxのシャドウがつきます。シャドウの色は、文字色が白の場合は黒、黒の場合は白で表示されます。
枠線	枠線の色を変えます。「色付」の場合は指定された色を元にした色で、「黒」の場合は黒い枠線で表示されます。「内側白線」にチェックを入れると、枠線の内側に白でさらに枠が表示されます。
内側シャドウ	「あり」にすると内側に影がつきます。シャドウの設定は以下で行います。
影の濃さ	影の不透明度を0%～100%で設定します。
影の位置X	影の横方向の位置をボタンの位置を基準に-100%から100%で設定します。
影の位置Y	影の縦方向の位置をボタンの位置を基準に-100%から100%で設定します。
影のぼかし	影をどれだけぼかすかを0%から100%で設定します。

ボタンを保存する場合に、「JPG作成」または「PNG作成」をクリックするとそれぞれJPG画像、PNG画像が作成されるので、右クリックで保存などしてご利用ください。

ホームページで使うボタン素材を、ブラウザ上で簡単に作成でき、無料で使うことができます。