What is Designmd.fun

Designmd.fun is a UI reverse-engineering and AI context generator. Paste the URL of any public website and the tool renders the page as a real visitor would see it, analyses the design system behind it, and writes out a complete set of machine-readable documentation files.

According to the site, a single analysis produces ten AI-ready files per URL: a production design.md, tailwind.config.ts, tokens.json, components.md, animations.md, prompt.md, figma.json and css-vars.css, plus colour and typography JSON. Each file is generated at the same time and cross-referenced so the outputs stay consistent with one another.

The workflow is deliberately short: paste a URL, let the analyser collapse colours into roles, type into a scale and spacing into a rhythm, generate the file set, then download a ZIP you can drop into a repository or paste straight into a coding agent. The extracted palette is presented as clickable swatches for quick copying.

Everything the tool extracts is described as coming from the rendered page and covers design system, UI components, layout grid, breakpoints, animations and motion, border radius, shadows, fonts, icons, colour palette and accessibility. The output is aimed at Claude Code, Cursor, Windsurf, ChatGPT, Lovable, Bolt, v0 and GitHub Copilot, with copy-ready prompt targeting for Claude, Cursor, Windsurf, Lovable and v0.

Designmd.fun also publishes a library of pre-analysed production design systems — Stripe, Linear, Vercel, Notion, Framer, Raycast, Supabase, Airtable, Cursor, PostHog, Resend, Warp and Webflow are among the listed sites — so you can browse reference documentation without running your own analysis. The site states that no signup is required to try it.

Designmd.fun turns any public website URL into ten AI-ready design documentation files — design.md, tokens.json, tailwind.config.ts, components.md and more — for tools like Claude Code, Cursor and Lovable.