DocsSupportPricing
Roadmap (has updates coming soon)XFigma3.7K
Sign inGet All-Access
  1. Components
  2. Spinner
  3. Spinner In Empty State
MarkdownShare

Shadcn Spinner In Empty State

Spinner in empty state. Built by composing Button, Empty, Spinner. A free, open source shadcn spinner example you can install with npx shadcn@latest add @reui/c-spinner-5 and edit as your own code.

Spinner in empty state.

For AI Agents

Hand your agent this brief or the ReUI MCP, not a screenshot. Free to install.

Best for: A centered loading view with the spinner in a muted tile, a Loading projects heading and a Cancel action

When to use

  • Pending states inside buttons, status badges and search fields while a request runs
  • Loading views for a card or an empty panel, including blurred covers over content being refreshed
  • Inline notes such as checking, syncing or reconnecting, led by a small tinted spinner or bouncing dots

When not to use

  • A view with no records yet that invites the first one to be added: use the Empty component
  • Content of a known layout, held as muted placeholder shapes until it arrives: use the Skeleton component
  • A wait where the share of work done is known, such as an upload percent: use the Progress component
  • A save control that tracks its own pending and done states after a click: use the Button component

Agent notes

  • The Cancel Button is disabled and has no handler; enable it and abort the running request from it
  • No example holds a pending flag and disabled is hardcoded where it appears; show the indicator and lock controls from your own request state
Markdownhttps://reui.io/components/spinner/c-spinner-5.md
MCPget_example("c-spinner-5")
Installnpx shadcn@latest add @reui/c-spinner-5
Full index for agents:llms.txtReUI MCP setup

Shadcn Components in Spinner In Empty State

  • Button
  • Empty
  • Spinner

About Shadcn Spinner In Empty State

Spinner in empty state. Built by composing Button, Empty, Spinner. A free, open source shadcn spinner example you can install with npx shadcn@latest add @reui/c-spinner-5 and edit as your own code.

What You Can Build With Shadcn Spinner In Empty State

  • Composes Button, Empty, Spinner, so it drops into any project already using those components.
  • Install it with the shadcn CLI: npx shadcn@latest add @reui/c-spinner-5
  • Open source and free, with the full source on this page to copy or adapt.

More Shadcn Spinner Examples

  • Basic Basic spinner.
  • In Buttons Spinners in buttons.
  • In Badges Spinners in badges.
  • In Input Group Spinner in input group.
  • Pending Buttons Button loading states
  • Overlay With Caption Overlay loading spinner
  • Full Page Full page loading state
  • Inline Text Inline loading text with spinner
  • Loading Dots Animated loading dots
  • Card Overlay Spinner overlay on card
  • Color Variants Spinner color variants

Related Shadcn Component Categories

  • Stepper

    Open-source shadcn stepper components for multi-step forms, checkout flows, and onboarding.

  • Switch

    Open-source shadcn switch components for settings toggles, preferences, and binary choices.

  • Table

    Open-source shadcn table components for admin tables, data display, and responsive lists.

  • Tabs

    Open-source shadcn tabs components for segmented content, settings views, and dashboard sections.

  • Textarea

    Open-source shadcn textarea components for comments, long-form input, and support tickets.

  • Time Picker

    Open-source shadcn time picker components for booking forms, opening hours, and shift scheduling.

Frequently Asked Questions

When should I use Shadcn Spinner In Empty State?

Use it for a centered loading view with the spinner in a muted tile, a Loading projects heading and a Cancel action.

Shadcn Spinner as a whole fits:

  • Pending states inside buttons, status badges and search fields while a request runs
  • Loading views for a card or an empty panel, including blurred covers over content being refreshed
  • Inline notes such as checking, syncing or reconnecting, led by a small tinted spinner or bouncing dots

For a view with no records yet that invites the first one to be added, use the Empty component. For content of a known layout, held as muted placeholder shapes until it arrives, use the Skeleton component. For a wait where the share of work done is known, such as an upload percent, use the Progress component. For a save control that tracks its own pending and done states after a click, use the Button component.

How do I install Shadcn Spinner In Empty State?

Run npx shadcn@latest add @reui/c-spinner-5. The CLI copies the source into your project, so you own the code and can edit it freely.

Is Shadcn Spinner In Empty State free to use?

Yes. Every ReUI component example is open source and free for personal and commercial projects.

Which components does Shadcn Spinner In Empty State use?

It composes Button, Empty, Spinner. The shadcn CLI installs those alongside the example.
PreviousIn Input GroupNextPending Buttons

Start building with ReUI Pro today.

Every Pro block, every style, and every future addition, with one license for unlimited projects.

Get All-Access

From $249, once. Lifetime updates.

Application

  • App ShellAdded 4 new App Shell blocks
  • Auth
  • Card
  • Dashboard
  • Dialog
  • Empty State
  • Event Calendar
  • Flow
  • Form
  • Gantt
  • Kanban Board
  • List
  • Navbar
  • Onboarding
  • Profile
  • Rich Text Editor
  • Schedule
  • Settings
  • Sheet
  • Stats
  • Timeline
  • Whiteboard
  • Wizard

Data Grid

  • Base
  • AdvancedNew Advanced category with 3 Data Grid blocks
  • Columns
  • Drag & Drop
  • Editing
  • Expansion
  • Filtering
  • Grouping
  • Virtualization

Charts

  • Area Chart
  • Bar Chart
  • Composed Chart
  • Line Chart
  • Pie Chart
  • Radial Chart
  • Sparkline
  • Status Tracker

AI & Agents

  • AI Chat
  • Agent Activity

Solutions

  • Dev Ops
  • AI Ops
  • CRM
  • Agents
  • Analytics
  • Billing
  • Bookings
  • Files
  • Inventory
  • Users

Templates

  • E-commerce
  • SaaS
  • Dashboard
  • Landing
  • All templates

eCommerce

  • Category Card
  • Checkout
  • Comparison
  • Coupon
  • Filter Sidebar
  • Product Card
  • Product Detail
  • Product Grid
  • Receipt
  • Review
  • Shopping Cart
  • Wishlist
  • Shop Hero

Marketing

  • Blog
  • Compare
  • Contact
  • CTA
  • FAQ
  • Hero
  • How It Works
  • Pricing

Resources

  • Components
  • Blocks
  • Icons
  • MCP for Agents
  • Docs
  • Support
  • Pricing
  • Tailwind Plus Alternative
  • Roadmap(has updates coming soon)
  • AffiliateSoon

Legal

  • Privacy Policy
  • Terms & Conditions
  • License
  • Refunds
  • Cookies

© 2026 ReUI. All rights reserved.

3.7K