UI & components

CSS animated buttons

CSS animated buttons make a page feel responsive before anything loads. Every button here runs live, so hover it, press it and tab to it, then copy the prompt that builds the whole set.

1 prompts

Prompts

Guide

How to prompt a good animated button

  • Describe each state. Hover, press, focus and loading.
  • Keep motion short. 150 to 300 milliseconds feels instant.
  • Respect reduced motion. Ask for a calmer version when the system asks for it.