Shadcn.io is not affiliated with official shadcn/ui
Default Spinner
A standalone React spinner component showing default size and color for basic loading states built with shadcn/ui Spinner
Simple loading states don't need complexity. This React pattern shows the basic Spinner component with default styling—no customization, just clean loading indication. Built with shadcn/ui Spinner at default size-4 (16px) and foreground color, it's perfect for content placeholders, blocking operations, page-level loading, initial data fetch, or any loading state where standard appearance works and customization adds unnecessary complexity keeping implementation simple.
Default Spinner preview
Installation
Related Components
Small Spinner
Smaller size-3 spinner for subtle loading
Large Spinner
Larger size-8 spinner for prominent loading
Primary Color Spinner
Spinner with primary brand color
Inline with Text
Spinner with text context
Loading Button
Button with loading spinner
Spinner in Card
Spinner in card context
FAQ
Was this page helpful?
Sign in to leave feedback.