CSS3グラデーションと角丸を使ったボタンを簡単に作成できるジェネレーター

CSS3グラデーションのツールとしてだけでも便利そうな、ボタンを確認しながら作成できるオンラインサービスを紹介します。

CSS Corners, CSS3 Gradient

ボタンの作成は簡単で、3ステップで完了します。

Step 1:角丸の設定

ボタンの四隅の角丸を設定します。
キャプチャは20px。

Step 2:グラデーションの設定

グラデーションのカラーと方向を設定します。

Step 3:余白の設定

ボタンとテキストの余白を設定します。

スタイルシートの生成

上記の三つの設定はリアルタイムにボタンのプレビューに反映され、スタイルシートも自動で生成されます。

CSS

上記設定のスタイルシート。