Progress

Progress bar se striped / animated variantami, 9 barvami, 5 velikostmi a label pozicemi

Installation

pnpm dlx shadcn@latest add https://registry.ceskysoftware.cz/r/progress.json

Usage

Preview

Barvy

primary

secondary

blue

green

red

orange

yellow

grey

dark

Velikosti

Styly

Normální60%

Striped60%

Striped + Animated60%

Pozice labelu

Nahoře50%

Vpravo

Dole

Uvnitř (xl)

Import

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

Example

// Základní <Progress value={75} color="primary" /> // S labelem vpravo <Progress value={50} color="green" showLabel labelPosition="right" /> // Pruhovaný animovaný <Progress value={60} color="blue" size="lg" striped animated /> // Popis nahoře <Progress value={90} color="orange" showLabel labelPosition="above" label="Upload" />

Dependencies

class-variance-authorityhttps://registry.ceskysoftware.cz/r/utils.json (registry)