Shadcn.io is not affiliated with official shadcn/ui
Loading Outline Button
A React outline button showing loading state with spinner and Processing text using disabled and variant outline props
Sometimes primary buttons are too bold for every loading state—outline buttons provide subtle loading feedback. This React outline button shows Spinner with Processing text in disabled state. Built with shadcn/ui Button variant outline and Spinner component, the bordered style feels lighter—perfect for secondary actions, cancel operations with async work, less prominent forms, auxiliary saves, or any loading button where outline styling matches your design system and primary button would be too visually heavy.
Loading Outline Button preview
Installation
Related Components
Loading Button
Primary button with spinner and loading text
Loading Secondary Button
Secondary variant with spinner
Loading Icon Button
Icon-only button with spinner
Outline Button
Outline button without spinner
Loading Small Button
Small button with spinner
Inline Spinner
Spinner with inline text
FAQ
Was this page helpful?
Sign in to leave feedback.