NOCTA UI

Progress

A progress indicator component with multiple variants, sizes, and animation support

Installation

Install the Progress component using the nocta-ui CLI:

npx @nocta-ui/cli add progress

Import the component:

import { Progress } from '@/components/ui/progress';

Examples

Default Progress

Basic progress65%

Variants

Default progress60%
Success progress75%
Warning progress45%
Error progress30%

Sizes

Small
Medium
Large

Animated Progress

Animated progress0%

Without Label

Api Reference

Prop

Type