ボタン
コピペですぐ使えるボタンのサンプルコードを動作・特徴別にまとめています。
無料ツール
ボタンを自由に作成

文字・サイズ・色・角丸・グラデーション・アイコン・ホバー・立体表現などを設定して、HTML・CSSを自動生成できます。

ボタン作成ツールを使う
新しいタブで開きます

基本

基本のボタンを作る方法

開閉

ハンバーガーボタンからドロワーメニューを開く方法

アニメーション

波紋アニメーション付きボタンを作る方法
ホバーでふわっと浮くボタンを作る方法

デザイン

影で立体的に見せるボタンを作る方法
立体的なボタンを作る方法
グラデーションボタンを作る方法
アイコン付きボタンを作る方法
ホバーで背景色が変わるボタンを作る方法
角丸ボタンを作る方法

自動

指定時間後に押せなくなるボタンを作る方法
郵便番号から住所を自動入力するフォームを作る方法

操作

ボタンを有効・無効に切り替えるトグルスイッチを作る方法
コピーボタン付きテキストエリアを作る方法
クリアボタン付きテキストエリアを作る方法
コピーボタン付きテキストフィールドを作る方法
クリアボタン付きテキストフィールドを作る方法

コンテンツ

ボタン付きカードを作る方法