Progress

Displays an indicator showing the completion progress of a task.

shadcn/ui docs
x

Installation

pnpm dlx shadcn@latest add https://neobrutal-ui.andongmin.com/r/progress.json

Usage

import * as React from "react";
 
import { Progress } from "@/components/ui/progress";
const [progress, setProgress] = React.useState(13);
 
React.useEffect(() => {
  const timer = setTimeout(() => setProgress(66), 500);
  return () => clearTimeout(timer);
}, []);
<Progress value={progress} className="w-[60%]" />