What changed
On August 4, 2024 (originally posted July 29), Replit replaced its Canvas surface with Replit Design. The top of every project now shows two parallel entries: Design and Build, so users can move from frame to running app inside the same project—no export/import round-trip.
The headline mechanic: 'Suggested next steps' cards
Click any already-generated frame and a floating panel called "Suggested next steps" appears. Each card is a single short instruction; one click forks a new frame while the original stays intact. The official docs describe three categories of suggestion:
- Recolor / restyle the selected frame
- Add a missing block (e.g., a header the frame lacks)
- Recompose for a new scenario (e.g., a phone viewport)
- On-canvas mockups are static. They look like real pages but store no data and connect to no external services.
- Restyling an existing app truly regenerates the entire style layer. Replit shows a time-and-cost warning first; specific credit costs have not been published.
- Mobbin is built in with 600,000+ real-world screens from 1,000+ apps (Replit's own numbers). Inspiration frames add no code to the project—docs state this explicitly.
- Pricing gate: starting a new app from a design frame requires Core ($25/month) or Pro ($100/month). The launch-page line "available to all users today" can easily be misread.
- Browser-only at launch.
- No independent third-party benchmark of scale has been published.
- Official blog: https://replit.com/blog/introducing-replit-design
- Official docs — what it is: https://docs.replit.com/design/what-is-replit-design
- Official docs — suggestion cards: https://docs.replit.com/design/explore-suggestions
- Third-party cross-check (billing / model list): https://best.xiaohu.ai/article/replit-design/
This is a fork-and-compare model, not an in-place edit. When a direction is wrong, both versions sit side by side for the user to choose.
A common misreading worth correcting
Replit Design is not "prompt-free." The official documentation opens with: *"generate design frames from prompts."* Every session still needs an initial entry point—one of:
1. A text prompt 2. A template 3. An import from Figma, a URL, a screenshot, or Claude 4. A design system
Suggestion cards are a second step on top of an existing artifact, and they only derive from the currently selected frame—they do not read user behavior or environment. The docs explicitly state the problem being solved is "staring at a blank prompt box and not knowing what to ask," not "no language required." Chat and suggestion cards are designed to be used together; the docs note: *"Chat isn't just for polish."*
Where this differs from competitors
| Tool | Position | |------|----------| | v0 / Figma Make | Generate the frame, then hand it off elsewhere to ship | | Replit Design | Frame stays in the same project; one click into Build produces a running app, or restyle an existing app in place | | Cursor / Claude Code | Code-side agents; lack a visual canvas and visual forking layer, so they aren't direct competitors | | Claude → Replit | Not competition; Claude has opened a "Send to Replit" handoff channel |
The genuine novelty is making fork + side-by-side comparison the default interaction. This matches how non-designers actually work: they are good at choosing between two options, weak at describing visuals from scratch.
Design system output
A finished design system lands as tokens.json + CSS variables + DESIGN.md—readable by both humans and models, and more executable than a brand-guidelines PDF.