Progress

Progress bar indicator built on Radix UI Progress

Preview

import { Progress } from "@/components/ui/progress"

<Progress value={60} />

Pass a value between 0 and 100. The indicator bar transitions smoothly when the value changes.

npx shadcn add @bonsai/progress

EmptyState

Ghost placeholders that mimic the shape of real content, with an optional action overlay

Skeleton

Loading placeholder animation for content that is still loading