A layered dual-ring loading spinner with a static outer guide ring and a rotating inner segment that inherits the current text color.
import { ConcentricRing } from "@/components/ui/concentric-ring"; export default function ConcentricRingDemo() { return ( <div className="flex min-h-64 w-full items-center justify-center gap-10 bg-background text-foreground"> <ConcentricRing className="size-6" /> <ConcentricRing className="size-10" /> <ConcentricRing className="size-16" /> </div> ); }