ボタンはどのページでも最もクリックされる要素です——登録、購入、ダウンロードのすべてを担います。6スタイル(グラデーション、アウトライン、3D、ピル、グロー、シャイン)と本物のホバー状態、カスタムカラー・角丸・パディングを提供します。
スタイルプリセットを選び、カラーとスライダーを調整して、コピー可能なCSSを取得。<style>ブロックに貼り付け、ボタン要素にclass="btn"を付けるだけでホバー効果も自動適用されます。
Frequently Asked Questions
Q: サイトにボタンを追加するには?
サイトにボタンを追加するには?生成されたCSSを<style>ブロックにコピーし、HTMLで<button class="btn">ラベル</button>を使用します。
Q: グラデーションボタンが単色に見えるのはなぜ?
グラデーションボタンが単色に見えるのはなぜ?グラデーションには開始色と終了色の両方が必要です——両方のカラーピッカーが設定されているか、backgroundが他のルールに上書きされていないか確認してください。
Q: ホバー効果は変更できますか?
ホバー効果は変更できますか?はい——.btn:hoverブロックは独立しており、transform・影・背景の行を自由に編集・削除できます。
Q: これらのボタンはアクセシブルですか?
これらのボタンはアクセシブルですか?はい。読みやすいコントラストを使い、:focus-visible { outline: 2px solid; outline-offset: 2px; } を追加してキーボードユーザーにフォーカスを示しましょう。
Q: 商用プロジェクトで使えますか?
商用プロジェクトで使えますか?もちろんです——生成されるCSSはオリジナルで、個人・クライアント案件ともに無料で利用できます。
日本の伝統色・和色
和色は平安時代の襲(かさね)の色目に由来する日本の伝統色。桜や山吹、瑠璃など、植物や自然の名前を冠した優しい色合いが特徴で、JIS慣用色名としても制定されています。現代のUIデザインにも落ち着いた配色として人気です。
山吹色 #F8B500山吹の花に由来する黄金色。JIS慣用色名
撫子色 #EEA9A9ナデシコの花の淡いピンク。平安時代から愛される
茜色 #B7282E茜草の根から染めた深い赤。夕焼けの色
若草色 #C3D825春の新芽を思わせる明るい黄緑
瑠璃色 #1E50A2仏教の七宝「瑠璃」に由来する深い青
桜色 #FEF4F4桜の花びらのようなごく淡いピンク
常磐色 #007B43常緑樹の深い緑。永遠を象徴する
Q: 和色とは何ですか?
和色とは何ですか?和色は平安時代の襲の色目に由来する日本の伝統色で、桜・山吹・瑠璃など自然の名を冠した色が多く、JIS慣用色名として269色が制定されています。
Q: 山吹色はどんな色ですか?
山吹色はどんな色ですか?山吹の花に由来する黄金色で、色値は #F8B500。JIS慣用色名の一つで、太田道灌の逸話でも知られる日本の代表色です。