2017
28
Jun

時間があったので、ボタンデザインジェネレーターを作成しました。
ボタンを追加するとき、ちょっと大きくしたり、ちょっと影増やしたり、デザイン調整することってありますよね。
実際にできたものを見ながら確認できるツールがあったら便利だなぁって、ずっと思っていたので、
自分で、CSSデザインジェネレーターを作ってみました。
ボタンデザインジェネレーター
http://generator.web-alpha.info/btn/
使い方は、見ていただけるとわかるかと思いますが、簡単に説明します。
[使い方]
①STEP1で調整します。
[設定できる項目]
・クラス名
・テキスト内容(→ボタン名)
・大きさ(縦/横)
・線
・角丸
・ボタン背景
・ボタン影
・文字
・文字影
・hover
※一番上のスライダー部分クリックしてから、調整すると同じようなボタンが簡単にできます。
②STEP2で、表示を確認。
③STEP3に出てきているコードをコピペする!
調整するだけで、簡単に表示できるように作成しています。
html+CSSコーディングを始めたばかりの人など、ご活用いただければと思います。
もし、バグや改善点などあれば、ご報告いただけるとうれしいです。
※今後、ボタン以外のバージョンも作成したいと思っています。
