How to rebuild any site 1:1 with Claude, Lovable, or v0
By Kiana Bluecher · · 5 min read
Rebuilding a reference by eye is slow and lossy. Rebuilding it from its own extracted system is fast and faithful. Here's the loop we use.
The workflow
- Extract the reference — colors, type, spacing, components, and W3C tokens.
- Drop the tokens into your stack (Tailwind config, CSS variables, or a theme file).
- Hand your AI builder the tokens plus the generated prompt, and rebuild section by section.
- Prefer the raw tokens over the prose brief for anything precise.
Same look, your content
Because the system is explicit, the model stops guessing brand colors and starts matching them verbatim. You reconstruct the exact feel, then swap in your own words and imagery. That's a rebuild, not a re-imagining.
The AI builders this works with
The extracted tokens and prompt drop straight into whichever builder you use:
- Lovable: Full-stack app generation, tuned for UX. Paste the prompt to reskin the whole build.
- v0 by Vercel: Strong at frontend UI components; feed it the tokens for on-brand output.
- Cursor: Precision edits in a real IDE — best for applying tokens across a larger codebase.
- Bolt.new: In-browser full-stack builds; hand it the token bundle plus the brief.
- Claude: General-purpose; great for section-by-section restyles from the raw tokens.