Saturation UIsaturation UI
DocsComponentsBlocks
⌘K

Getting Started

IntroductionInstallationTheming

Components

AccordionAI Chat InputAlertAnimated GroupAnimated NumberAvatarBadgeBorder TrailBreadcrumbButtonButton GroupCalendarCardChartCheckboxCollapsibleComboboxCommandContext MenuData TableDate PickerDialogDropdown MenuEmptyFieldGlow EffectInputInput GroupItemKbdMenubarNovel EditorPaginationProgressive BlurProgressSelectSheetSkeletonSonnerSpinnerSpotlightSwitchTableTabsText EffectText ShimmerTextareaToggleToggle GroupTreeTypography
Components
/
Progress

Progress

Displays an indicator showing the completion progress of a task, typically displayed as a progress bar.

Preview

Installation

CLI

npx shadcn@latest add https://ui.saturation.io/r/progress.json

Manual

Copy and paste the component source code into your project.

Usage

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

<Progress value={33} />

Examples

With Label

Progress0%

Controlled

API Reference

Progress

PropTypeDefaultDescription
valuenumber-The progress value (0-100). Use null for indeterminate state.
classNamestring-Additional CSS classes

On This Page

  • Preview
  • Installation
  • Usage
  • Examples
  • API Reference

Deploy your Saturation UI app

Build beautiful, saturated interfaces with our component library.

Deploy to Vercel for the best performance and developer experience.