ボタンUI 56選

かっこいい系・可愛い系・近未来系に加えて、オシャレ・モダン系、ゲーム風・質感系、アイコン演出系も追加。ホバーで動きを確認して、「コピー」でCSSごと持ち帰れます。

01. ネオングローかっこいい / ホバーで発光
02. グラデーションシフトかっこいい / 色が流れる
03. シャインかっこいい / 光が走る
04. ボーダードローかっこいい / 枠線が描画される
05. 押し込み3Dかっこいい / クリックで沈む
06. ゴースト反転かっこいい / 塗りつぶし反転
07. 斜めスライド塗りかっこいい / 斜めに塗られる
08. グリッチかっこいい / ノイズが乱れる
09. メタリックかっこいい / 金属の光沢
10. ロングシャドウかっこいい / 影が伸びる
11. ぷにぷにゼリー可愛い / 押すと潰れる
12. パステルグラデ可愛い / ゆめかわカラー
13. キャンディ風可愛い / 縞模様が流れる
14. ふわふわ浮遊可愛い / ずっと浮いてる
15. 肉球ポップ可愛い / 肉球が飛び出す
16. ポップシャドウ可愛い / 黒縁+ずれた影
17. シャボン玉風可愛い / 透明感バブル
18. ゆらゆらwiggle可愛い / ぷるぷる揺れる
19. サイバーパンク切り欠き近未来 / clip-path角落とし
20. ホログラフィック近未来 / 虹色に揺らめく
21. スキャンライン近未来 / 走査線が流れる
22. HUDブラケット近未来 / 四隅が展開する
23. エネルギーチャージ近未来 / ゲージが満ちる
24. ネオンチューブ近未来 / 看板みたいに点滅
25. 回路基板風近未来 / 基板が通電する
26. ワイヤーフレーム実体化近未来 / 下書き→本物へ
27. グラスモーフィズム実用 / すりガラス質感
28. リップル実用 / クリックで波紋
29. マグネット矢印CTA実用 / 矢印が吸い付く
30. シマー実用 / スケルトン風の光
31. 矢印スライドCTAオシャレ / 矢印が入れ替わる
32. アンダーライン&斜め矢印オシャレ / 下線が伸びる
READ MORE
33. サークル矢印オシャレ / 円が拡大して反転
34. ミニマルモノトーンオシャレ / 下から満ちる
35. エディトリアルセリフオシャレ / 文字がスライド
36. ボーダーランオシャレ / 枠線が一周する
37. スキュー塗りオシャレ / 斜めの帯が満ちる
38. ピル型スプリットオシャレ / 丸が伸びて包む
39. 8bitピクセルゲーム風 / 押すと1段沈む
40. RPG木製看板ゲーム風 / 木目+彫り文字
41. メタルプレートゲーム風 / 金属光沢が走る
42. 宝石グロッシーゲーム風 / ぷっくり半透明
43. ゴールドガチャゲーム風 / 金の輝きアニメ
44. 石版刻印ゲーム風 / ルーン文字が発光
45. アーケードボタンゲーム風 / LEDリング点滅
46. エネルギーゲージゲーム風 / 満タンでREADY!
47. アイコンスライドCTAアイコン演出 / 矢印が先へすっと
48. ダウンロード進捗アイコン演出 / リング→チェック
49. いいねハートアイコン演出 / クリックで弾ける
50. 送信→紙飛行機アイコン演出 / sendが飛んでいく
51. カート追加アイコン演出 / 揺れてバッジ+1
52. 再生リングアイコン演出 / 外周リングが回転
53. ベル通知アイコン演出 / ブルブル+赤ドット
54. シェア展開アイコン演出 / ホバーでSNS展開
55. 成功モーフアイコン演出 / 円に縮んでチェック
56. 矢印周回CTAアイコン演出 / 一回転して右へ抜ける