アニメーション付き!フラットなカラーのボタンを生成することができるWEBサービス「2.5dBUTTON」

アニメーション付き!フラットなカラーのボタンを生成することができるWEBサービス「2.5dBUTTON」

アニメーション付き!フラットなカラーのボタンを生成することができるWEBサービス「2.5dBUTTON」

2.5dBUTTONは、必要な項目を設定するだけで、フラットなボタンを生成してくれるジェネレーターです。サイトに設置するためのHTMLとCSSが出力されるので、コピペでボタンを実装することができます。

2.5dBUTTONの使い方

2.5dBUTTONにアクセスします。

上部に表示されるプレビューを確認しながら、テキストや色などを設定していきます。

ボタンの設定

BUTTON LABEL ボタン上に表示するテキスト
LABEL SIZE テキストのサイズ
ICON アイコン
ICON SIZE アイコンのサイズ
LABEL COLOR テキストの色
POPUP DIST マウスホバー時のアニメーション
HORIZONTAL PADDING 横の余白
VERTICAL PADDING 縦の余白
RADIUS 角丸
SPEED アニメーションのスピード
BUTTON COLOR ボタンの背景色
SIDE DARKNESS 影の不透明度

出力されたHTMLとCSSをサイトにコピーして利用します。

HTMLとCSSのコピー

あとがき

アニメーションも付いているのが良いですね。サクッとボタンを実装したいときにぜひ。

この記事が気に入ったら
いいね!してね♪

Twitter で

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です