Health & Fitness · Charcoal & Voltage
Workout App UI Design Template
Forge is a strength-training app design with a charcoal-and-voltage look, built for founders and designers shipping a workout tracker.



Aperçu
Explorer les écrans
Prévisualisez le design d'app mobile workout, entièrement modifiable dans Sleek.
À propos de Workout App
Forge is a workout app UI design template built around a "Charcoal & Voltage" aesthetic: a near-black graphite base, slate panels separated by thin hairlines, bone-white text, and a single electric-lime accent reserved only for active sets, progress fills, and the primary action. The big numbers (reps, weight, the rest timer) are set in a heavy condensed grotesque, tracked tight, so the interface feels athletic and dense, like a dim gym at 6am with one bright bar overhead.
The template ships seven connected screens that form a complete training flow: a Today home with today's split and a weekly volume chart, a Programs list of training plans, an Active workout logger with a plate-weight stepper and set table, a full-screen Rest timer with a depleting lime ring, an Exercise detail with target muscles and execution cues, a Progress dashboard with PR cards and a volume trend, and a Profile with stats and a consistency grid. A signature vertical voltage meter climbs the left edge of the active workout and reappears as a mini meter on workout cards.
Use it in Sleek and make it yours: restyle the palette, edit any screen with AI by describing the change, and add the flows your product needs. Then export it to code, copy it into Figma, or hand a prompt to an AI agent to build it for real, far faster than starting from a blank canvas.
Ce qu'il y a dedans
Écrans inclus
Today
A 'Ready, Marcus' greeting over a hero card for today's Push Day split with exercise list and a full-width "Start Session" button, plus a weekly volume bar chart and a streak counter.
Programs
A stacked list of training plans (Push/Pull/Legs, 5x5 Strength Base, Hypertrophy 4-Day) as slate panels with difficulty tags, schedule, and lime week-progress fills, plus a "Create Custom Program" option.
Active Workout
A live session showing the exercise name, a plate-weight stepper with quick-add increments, and a set table with previous lifts, weight, reps, and lime checkmarks to log each set.
Rest Timer
A full-screen 01:30 countdown set in a giant tracked-tight numeral with a lime ring depleting around it, an 'Up Next' set preview, and '+15S' and 'Skip' controls.
Exercise Detail
A barbell bench press hero image with a primary-exercise tag, target muscle chips, and numbered execution cues so lifters know exactly how to perform the movement.
Progress
Personal-record cards for squat, deadlift, bench, and press in oversized lime numerals, plus a 30-day volume trend line chart and a body-weight section.
Profile
An athlete header with total workouts, day streak, and total pounds lifted, a 12-week consistency grid, and settings for equipment and notifications.
Design et fonctionnalités
Fonctionnalités clés
- Charcoal & Voltage aesthetic: graphite base, slate panels, one lime accent
- Condensed grotesque for oversized reps, weight, and timer numerals
- Signature vertical voltage meter that climbs as sets are logged
- Plate-weight stepper with quick-add increments and a set table
- Full-screen rest timer with a depleting lime ring
- Bottom nav bar with monochrome line icons and a lime active underbar
- Progress dashboard with PR cards and a volume trend chart
- Consistency grid and streak tracking on the profile
Public
Pour qui c'est fait
Cas d'usage
Ce que vous pouvez créer
- Launch an MVP for a strength-training or workout tracker app
- Mock up screens for an investor or stakeholder pitch
- Hand a consistent, athletic dark-mode UI off to developers
- Explore a redesign of an existing fitness app
Comment utiliser ce template
- 1
Ouvrir le template
Parcourez les écrans et prévisualisez le design complet pour voir s'il correspond à votre idée.
- 2
Utiliser ce template
Ouvrez votre propre copie entièrement modifiable dans Sleek en un clic.
- 3
Modifier avec l'IA
Restylez la palette, changez les mises en page, et ajoutez ou supprimez des écrans simplement en décrivant ce que vous voulez.
- 4
Exportez et lancez
Exportez votre design ou confiez-le aux développeurs, et poursuivez le développement jusqu'au lancement.
Questions fréquentes
Templates d'apps mobiles associés
Commencez à designer votre app workout
Utilisez-le dans Sleek et faites-en le vôtre : restylez la palette, modifiez n'importe quel écran avec l'IA, et exportez en code ou Figma.
Utiliser ce template







