3

Spinner

A spinning loading indicator icon.

Last updated August 9, 2026

CreditsUnchangedPublished

Copied from shadcn/ui.

Overview

import { Spinner } from "@/components/ui/spinner"
 
export function SpinnerDemoExample() {
  return <Spinner />
}

Installation

$ npx shadcn@latest add https://ui.persian-labs.ir/r/spinner.json

Usage

import { Spinner } from "@/components/ui/spinner"
 
export function Example() {
  return <Spinner />
}

In a Button

Button renders a Spinner automatically when its loading prop is set.

import { Button } from "@/components/ui/button"
 
export function SpinnerButtonExample() {
  return (
    <Button loading>Please wait</Button>
  )
}

RTL

import { Button } from "@/components/ui/button"
 
export function SpinnerRtlExample() {
  return <Button loading>لطفاً صبر کنید</Button>
}

API Reference

Spinner