Loading Button

Finally, a loading button that just works. Pass loading= and it shows a spinner, disables itself, and swaps the text—all automatically. No more juggling disabled states and conditional icons. The spinner matches your text color and the transition is smooth. Perfect for form submissions, API calls, or any async action. When loading completes, it snaps back instantly. One prop, zero hassle.

Loading Button preview

Installation

npx shadcn@latest add https://www.shadcn.io/registry/loading-button.json

npx shadcn@latest add https://www.shadcn.io/registry/loading-button.json

pnpm dlx shadcn@latest add https://www.shadcn.io/registry/loading-button.json

bunx shadcn@latest add https://www.shadcn.io/registry/loading-button.json

Related Components

FAQ