Power Track - Workout Tracker Template

PowerTrack is a simple, clean fitness app made for anyone trying to keep track of their workouts and feel good doing it. Whether you’re lifting weights, doing yoga, or just walking a bit more — this gives you everything you need to stay on top of your game.

“Create a full-stack responsive web app for tracking weightlifting workouts. Name it PowerTrack. Users should be able to build custom workout templates, track sets, reps, and weights, and include supersets and giant sets. Use a sporty, black-white-red color palette and a bold modern font. Prioritize a mobile-first layout and use Supabase for authentication and data.”

Workout Log: Daily entries with tagging by muscle group, duration, intensity

Builder: Custom routines via repeatable components (supersets, exercises, notes)

Analytics: Graphs for weight lifted, duration trends, etc.

Responsive UI with smart hiding/navigation (sidebar on desktop, bottom nav on mobile)

Profile + settings page

Calendar logic built from Bolt’s dynamic content lists + filters

Used “Card Stack” for workout builder blocks — flexible and scalable

Created visual tags (e.g. “Push”, “Pull”, “Leg Day”) with color tokens

Tweaked mobile padding for tap targets and improved readability

Reused header/footer across pages via Components for speed

Supabase auth requires setup:This template uses Supabase for login/signup. If you’re duplicating it, make sure to plug in your own Supabase project credentials or swap in a simpler auth method for demos.

Workout builder cards may break on deep mobile nesting:On very small screens, the nested superset/giant set logic can overflow. I recommend checking layout padding/margins in Bolt’s mobile preview and adjusting manually.

Progress charts can glitch without mock data:If your progress tracker looks empty or broken, it’s likely because there’s no dummy data loaded yet. Either add some test workouts or bind the chart to static content for now.

Red hover states need manual styling in some components:Not every button respects the color token by default. If you see gray or blue instead of red, double-check the variant or manually override the hover state.

Font weights can appear off across devices:The bold modern font works great on most screens, but may render too heavy on low-DPI displays. Try adjusting font-weight slightly for better balance.