Click through your app once. Click2spec captures every visible control, the measured design system, the tech stack and the navigation — and writes a ready-to-paste pack your AI tools can actually build from.
No card·Runs in your browser·Works behind your login
Click through your app once.
THE PROBLEM
Ask an AI to redesign a screen it has never seen and it confidently invents a product that doesn’t exist. Everyone working on a real app knows the workarounds:
You paste fourteen screenshots and hope the AI infers the flow, the controls and the rules behind them. It doesn’t.
You hand-write how the app works today. Two hours per feature, incomplete by nature, stale within a month.
Without real context the AI restyles what must stay, misses constraints that matter, and you iterate five times before settling.
The fix isn’t better prompts. It’s better context.
HOW IT WORKS
No integrations, no API access to your product, no tickets to IT. If you can use the app in your browser, you can document it.
Open your app, click the Click2spec icon, hit Record and use it normally. Every screen, control and click is captured as structure — not just pixels.
Drop a one-line note where knowledge lives: “only admins can approve”, “limit is 50 per account”. Click2spec works out the app’s purpose and users on its own.
Emails, card, phone and similar numbers are masked automatically. You inspect every step, screen spec and screenshot, and drop anything sensitive before anything is generated.
One pack, four formats: Claude, ChatGPT, a Cursor rules file and a Figma Make reconstruction spec. Copy & open your AI tool in one click, paste the numbered screenshot storyboard next to it, or export a ZIP with everything.
WHAT IT CAPTURES
Buttons, icon-only buttons, menus with their full option lists, tabs, toggles, data grids and dialogs — grouped by region, with honest totals when a screen is huge.
Hex colors with transparency, fonts, radii, the primary vs. ghost button styles, status badges, theme (light or dark) and the icon set — measured from the live UI.
React, Next.js, Angular, Vue, Tailwind, MUI, Ant Design and more — plus live chart configurations — so generated code matches what you run.
Which button leads to which screen, the persistent sidebar and header described once, and every route with its pattern — ready to wire a prototype.
Entities inferred from forms and lists (types, required fields, enums), validation messages, feedback toasts, and your own notes.
Claude, ChatGPT and Cursor packs end with checkboxes observed in the real product, so you — or the AI — can verify a rebuild is actually faithful.
REAL OUTPUT
Below is genuine, unedited output from Click2spec’s generator for a short recording of a demo invoicing app (fictional company, fictional data).
Table sample cells are replaced by their format (‹text›, $##,###.##) and record pages are named by type (“Contact detail”), not by the person shown. Headings, labels and text you type are captured as they appear — that’s what the review step is for.
WHO IT’S FOR
Paste the Figma Make spec and get a redesign that keeps the real controls, labels and tokens — not a generic dashboard.
Drop the Cursor rule into .cursor/rules and rebuild or extend a legacy screen with the right routes, fields and validations.
Give Claude or ChatGPT the real workflow before asking for a spec, a test plan or onboarding docs.
Document a client’s app in one session — behind their login, without asking for API access or source code.
SECURITY
A recorder that can see internal apps has to earn trust architecturally — not with promises.
Captures live in your browser’s extension storage. There is no backend for your data, no background upload and no telemetry. We never see what you record.
No “all sites” access and no browsing-history permission. Click2spec asks for one site at a time, and Settings shows every site it can access with a one-click revoke.
Password, one-time-code and card fields are never captured — even after “show password”. Emails, card, phone, IBAN and API-key-like strings are masked inside the page. Screenshots aren’t masked, so you review each one.
Generate fully offline with the built-in template, with your own Anthropic or OpenAI key, or with any OpenAI-compatible endpoint you run (https only). Screenshots are never sent to a model.
Nothing is generated until a person reviews every step, screen spec and screenshot. What you delete is removed from the pack and its exports.
Every pack tells the AI that captured UI text is data, never instructions — and page text can’t forge the document’s structure.
PRICING
A pack is one recording turned into a document — switching formats, re-exporting or reopening a pack is always free. Teams: one Pro seat per person.
FAQ
No. Password, one-time-code and card fields are never captured — including fields switched to “show password” and one-time codes split into separate boxes. Click2spec won’t record identity-provider sign-in pages (Okta, Microsoft, Google sign-in, Auth0 and similar). It documents what happens after you’re in.
On your computer, in the extension’s local browser storage, protected by your computer account like the rest of your browser profile. Nothing is uploaded in the background. With the built-in template nothing ever leaves your machine; with smart synthesis on, the text capture (never screenshots) goes only to the AI endpoint you configured, when you generate or switch formats.
Yes — that’s the point. Click2spec records inside your already-authenticated browser session, so it needs no credentials, service accounts or network access to your app.
Web apps in Chrome, including single-page apps built with React, Angular or Vue, dense, icon-heavy tools, and web components. One browser tab per recording. Content inside embedded iframes isn’t captured (the frame is declared in the pack so the AI doesn’t drop it), and canvas-drawn tools such as design canvases or WebGL dashboards yield screenshots and your notes rather than a full control inventory. Desktop and native mobile apps are out of scope.
A pack is one recording turned into a document (or several recordings combined into one app pack). Switching formats, re-exporting and reopening packs in your Library never count. The free plan runs on a free license key: enter your email on Lemon Squeezy (no card), paste the key into Click2spec, and each new pack uses one of its 2 packs. The count lives with Lemon Squeezy, so reinstalling the extension doesn’t reset it. After your 2 free packs you can keep recording and keep everything you made; generating new packs needs Pro.
Pro is $19.99 per user per month. Checkout runs on Lemon Squeezy (cards and the usual wallets, sales tax and VAT handled for you); you get a license key on the receipt, paste it into Click2spec, and you’re done. Cancel anytime from the Lemon Squeezy customer portal. The license check only sends that key — never anything you record.
Anything that reads text or files: Claude (chats and Projects), ChatGPT, Cursor (as a project rule), Figma Make, and other assistants. A ZIP bundles the document with every screenshot, and a JSON export exists for your own pipelines.
The data flow fits in one sentence: captures stay in the browser, and the only outbound request carrying your data is the one you trigger, to the endpoint you configured. Add per-site permissions with one-click revoke, in-page masking, a human review gate and support for your own model endpoint. We don’t have a SOC 2 report today — bring your questionnaire and we’ll answer it honestly.
Record one workflow today. Paste the pack into your favorite AI tool. You won’t go back to screenshot archaeology.