A sleek, vertical progress meter with rounded caps, diagonal striped fill, and an inline percentage label. Drop it into dashboards, stats cards, or loaders to visualize completion, capacity, or goal tracking with a modern, high-contrast look.

Functionality

• Vertical orientation with smooth animated fill.

• Striped/gradient fill (optional animation speed & direction).

• Inline percentage label (inside or outside, left/right options).

• Configurable range: min/max, step, and decimal precision.

• Threshold colors (e.g., safe/warning/danger) with auto-switching.

• Track styling: thickness, radius, shadow, background tint.

• Direction control: bottom→top or top→bottom.

• Value bindings from Firestore/Supabase/REST/local state.

• Accessibility: ARIA/semantics label and high-contrast text.

• Light/Dark themes and brand accent support.

• Optional tooltip with exact value on tap/hover.

• Performance-friendly: minimal rebuilds and hardware-accelerated animation.

Great for: capacity/utilization, KPI dashboards, download/upload status, storage usage, fitness goals, hydration/energy meters, progress toward targets.

Keywords: FlutterFlow progress bar, vertical progress, striped progress, gradient fill, completion meter, capacity gauge, utilization bar, KPI widget, goal tracker, percentage label, animated stripes, bottom to top, rounded caps, slim bar, status indicator, threshold colors, warning state, success state, progress indicator, dashboard component, loader, data binding, Firestore, Supabase, REST API, light theme, dark theme, accessible UI, mobile widget, Flutter widget, FlutterFlow component, minimal design, modern UI, performance optimized.