Taco Bell
A design blueprint Spectr produced from Taco Bell. Scroll to look closer.
Ship a neon, dark-first build-your-box QSR app with Taco Bell-grade polish
A complete UI blueprint of the Taco Bell iOS app, documenting the purple-to-magenta brand gradient, the violet-tinted dark canvas, the build-your-box customizer with its gradient box-preview hero and numbered step pills, and the Hot Sauce Yellow value highlight. Captured from the real product and distilled into exact tokens an AI agent can build against directly.
Use it as the baseline for any quick-service, customizable-menu, or order-ahead app and skip months of taste calibration. Every value is documented to the exact hex, font weight, corner radius, and motion timing — the #702082 to #C72BC8 gradient, the #0E0A14 purple-black canvas, the #FFC700 yellow, the magenta radios, and the glow-driven box-preview hero.
Screens documented
- Build-your-box customizer with a gradient box-preview hero
- Numbered step pills with active gradient and done green states
- Customizer option rows with magenta radios and steppers
- Persistent bottom CTA bar with a live box total
- Cravings menu tile with a gradient Add pill
- Five-tab bottom bar on a violet-black canvas
What a Spectr spec includes
Screen-by-screen documentation, complete design system (color, typography, spacing), navigation map, component library, implementation notes, and a Claude Code prompt — everything an AI coding agent needs to build.
Turnaround
Most mobile apps produce a full spec in under 90 seconds from a single screen recording. Upload your own MP4 and watch the blueprint generate live.
Why not a design file?
Design files don't compile. A Spectr spec is optimized for AI coding agents like Claude Code — it produces working code on the first prompt, not layered artboards.
Target stack
Every spec targets Expo SDK 54 and React Native on an iPhone 15 baseline. The Taco Bell blueprint translates cleanly into an Expo Router app structure.