Vercel
A design blueprint Spectr produced from Vercel. Scroll to look closer.
Clone Vercel iOS down to the true-black canvas and status-light deployments list
A pixel-faithful design token catalog reverse-engineered from the Vercel iOS app, built around the deployments list where one colored dot answers the only question that matters. Real OLED-true black, Geist Sans and Geist Mono, hairline borders instead of shadows, and the Ready-Building-Error traffic light as the only systemic color.
Everything you need to ship a Vercel-grade developer dashboard: exact hex values, the deployments list with status dots and environment tags, the gridless analytics charts, the monospace build-log viewer, and the single-fill triangle logomark. Comes with framework-neutral specs plus SwiftUI, Expo, and Jetpack Compose guides.
Screens documented
- Deployments list with status dots
- Project overview with production domain
- Build-log viewer in monospace
- Web Vitals analytics charts
- Environment variables editor
- Domains configuration list
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 Vercel blueprint translates cleanly into an Expo Router app structure.