Your budget

Prices in US dollars

Show 344 products up to $30

No. 054UI components

Animated Button Design Pack

Twenty-four animated buttons with hover, press, loading and success motion, as Figma interactive components, CSS keyframes and Lottie files.

$7

Fits your $30 budget

  • Includes the Standard license: personal, commercial and client work for one person.
  • Instant download after payment, plus an email with links that stay active for 30 days.
  • Refund within 14 days if you haven't downloaded it yet, if it doesn't work in the supported software listed here, or if it's faulty and we can't fix it.
Contents
24 components
File formats
.fig, .aep, .json, .html, .css, .mp4
Supported software
Figma, After Effects, Lottie, HTML/CSS
Download size
9 MB
Good for
  • Interactive prototypes
  • Web app micro-interactions
  • Form submit feedback

About this product

The 24 buttons here combine eight interactions (fill sweep, border draw, press ripple, icon slide, arrow nudge, loading morph, success check and error shake) with filled, outline and ghost styles. In Figma they are interactive components using Smart Animate, on the web the same motion is written as CSS keyframes, and the loading, success and error sequences are also exported as 60 fps Lottie JSON.

Timings are ready to copy into a stylesheet, from 150 ms hovers to a 1.2 s loading loop, and designers can put real press and submit feedback into prototypes for review. After Effects sources and MP4 previews are included for anyone who wants to adjust easing or color.

What's inside

  • 24 buttons: 8 interactions × filled, outline and ghost styles
  • Figma interactive components with Smart Animate
  • CSS keyframes with timings from 150 ms to 1.2 s
  • Loading, success and error sequences as 60 fps Lottie JSON
  • After Effects sources and MP4 previews included

License

Standard license

Included with every purchase

For one person. Use the assets in unlimited personal and commercial projects, including work you deliver to clients.

Allowed

  • Design a client's website with a UI kit and hand over the finished site
  • Use the same asset in as many of your projects as you like
  • Build your startup's pitch deck from a presentation template
  • Use an icon set throughout your company's web app

Not allowed

  • Reselling, sharing, sublicensing or giving away the files, as they are or modified, for example on stock sites or marketplaces
  • Uploading the files anywhere others can download or extract them, such as a public repository
  • Letting several people work from one Standard license (a Team license covers that)
  • Selling print-⁠on-⁠demand merchandise or templates built on the assets without an Extended license

Search by name, type, tag or app, for example “dashboard” or “Figma”.