Brief a project, collect the references, and connect your AI agent over MCP. It builds full multi-page designs inside SpecShot, your client reviews them section by section, and you hand off a build-ready spec.
Free forever. No card. Designs and captures stored as data, never as a running site.
Build a hero with a centered headline,
subtext, and two CTAs. Primary blue
(#2563eb), flex layout, 24px gap,
and 32px section padding.
Prompt the tool you build with, or let your connected agent build the pages for you.
Five steps from a brief to a design your client has already signed off on.
Start a project, write the brief, set the goal and the audience, and add a page for every screen.
Point any MCP agent at SpecShot. It reads the brief, brand, captures, and pages as full context.
The agent builds real, multi-page designs and files each version under the right page.
Share a design. Your client pins feedback on the exact section, and it flows back to the agent.
Export a build-ready spec: stable section ids, real copy, brand tokens, and a build instruction.
SpecShot speaks MCP. Connect any agent that supports it, through a hosted endpoint or the @scayver/specshot-mcp-server npm package. Your agent reads the brief, the brand, the captures, and every page, then builds real designs and files them where they belong.
connect project Northwind redesign
reading brief, brand, 12 captures, 5 pages
build page Home version 3
filed under Home. ready to review
As your agent works, each design lands on the page's canvas. Compare versions, watch new ones appear, and pick the one that ships.
Make the headline bolder.
Use three cards, not four.
Share a design through the client portal. No account, no install. Your client pins feedback on the exact section they mean, and every note flows back to the agent so the next version answers it.
Not every job needs the full workflow. Capture a section, generate a builder-specific prompt, and export it. Same engine, one click.
A capture pairs the screenshot with structured tokens and a generated prompt. The same spec rail you see everywhere on this page.
Build a hero with a centered headline,
subtext, and two CTAs. Primary blue
(#2563eb), flex layout, 24px gap,
and 32px section padding.
Switch the target and the prompt rewrites itself for that builder.
Build a hero section with a centered headline,
subtext, and two CTAs. Primary blue
(#2563eb), flex layout, 1.5rem gap, 2rem padding.
Match the spacing scale and type ramp below.
Colors, spacing, type, and radius pulled into reusable tokens.
SpecShot infers what a section is so the prompt frames it right.
Captured DOM is stored as structured data, never runnable HTML.
Push a capture to GitHub, Linear, or any webhook in one click.
Open the SpecShot side panel on any page, hover to outline a section, and click to capture. The screenshot and design context land in your project, ready for the agent to study.
SpecShot stores the context an AI agent needs, not a copy of anyone's site.
I brief the project, connect my agent, and it builds the pages inside SpecShot. The first designs are close enough that I ship, not restart.
Illustrative example.
Connecting over MCP changed the loop. My agent reads the whole project, not one screenshot, so it stops guessing brand and spacing.
Illustrative example.
Clients pin feedback on the exact section in the portal. It flows back to the agent, and white-label handoff sends the spec out with our name on it.
Illustrative example.
Every plan runs the full workflow. Paid plans add volume, seats, share links, and white-label.
Start a project, connect your agent, and watch it build the pages. Free forever, no credit card required.