Progress Bar
Progress indicator component with consistent 8px height and Genentech blue styling for visualizing task completion and loading states
Basic Usage
Simple Progress Bar
Basic progress bar with percentage label
Progress Bar with Custom Label
Progress bar with custom descriptive label
Progress Bar Without Label
Clean progress bar without visible label
Animation & Patterns
Animated Progress
Smooth Animation
Striped Pattern
Animated Stripes
Smooth transitions and striped patterns for enhanced visual feedback
Real-World Examples
File Upload Progress
Interactive file upload simulation with dynamic labels and variant changes
Form Completion Progress
Multi-step form progress with custom max value and step navigation
Task Completion Dashboard
Dashboard view showing multiple progress indicators with different goals and states
Loading States
Different loading states with appropriate variants and animations