CSSベースのかっこいいボタンがぱっと簡単に作成できるオンラインサービス -Twitter Bootstrap Button Generator

Twitter Bootstrapをベースにしたボタンを簡単に作成できるオンラインジェネレーターを紹介します。

サイトのキャプチャ

Twitter Bootstrap Button Generator

使い方は簡単で左のパネルで、ボタンのテキスト、サイズ・カラー・タイプなどを選択するとリアルタイムにボタンを生成します。

ボタンのテキストは日本語でももちろん平気です。

サイトのキャプチャ

生成したボタンとコード

ページに実装する際は、生成されたコードとTwitter Bootstrapを用意します。

外部ファイル

<link href="css/bootstrap.min.css" rel="stylesheet">

HTML

<a href="#" class="btn btn-danger"><i class="icon-white icon-heart"></i> ボタン</a>

※アイコンを使用する場合は、Twitter Bootstrapのimgフォルダも必要です。
アイコンは下記のものが利用できます。

アイコンのキャプチャ

Twitter Bootstrapで利用できるアイコン一覧

top of page

©2017 coliss