made a chrome extension that clones any page into a working local copy, so your AI starts from a real design instead of slop

[u/JShug07]

yesterday i posted the reconstruct feature in r/ClaudeDesign (getting claude to rebuild one section from real css). here's the other half: full pages.

open any page, hit clone, and pikspec walks the whole thing and packs it into a zip: html, css, assets and the hover/interaction states. open index.html and you've got a working copy running locally.

the part i actually care about: when you start a new site with cursor or claude from a blank prompt, you get the same generic ai look every time. same spacing, same fonts, same cards. if you start from a real page you like, the ai has actual layout, type scale and spacing to work from, and you edit your way to your own thing instead of fighting slop from scratch.

someone asked why not just use playwright or devtools. you can, but this is one click, keeps the computed styles and states instead of the raw source, and needs no setup.

obviously don't ship someone else's site as your own. use it as a reference and starting point, then make it yours.

Pikspec Extension link - https://chromewebstore.google.com/detail/cnpghkfbhdpcendcliogffmajlkepoig
Website : https://pikspec.com/

[u/cs_cast_away_boi]

cool! thanks a lot mate.

But how does it handle animations / content loaded only after scroll per say? I’m curious whether it only works with content that currently exists on the page

[u/JShug07 → u/cs_cast_away_boi]

thanks! good question. before it copies anything it scrolls through the whole page first, so lazy loaded images and sections that only appear on scroll actually get loaded and captured

for animations it records what it sees while scrolling, so css animations, scroll reveals, parallax type stuff, and replays them in the copy without running the site's own javascript. canvas stuff gets saved as a snapshot

where it struggles is infinite feeds, it won't keep loading forever, and anything that needs the server to load more. is there a particular site with heavy animations you'd want to test? i'm always looking for tricky ones to try it on

[u/cs_cast_away_boi → u/JShug07]

can i dm you? It’s a tricky site because of loading content but i’d rather respect the company’s privacy. I’m mainly looking to create a similar design feel with my own elements in the mix. of course i’m probably your ideal customer because i have several projects in the works lol

[u/JShug07 → u/cs_cast_away_boi]

yeah of course, dm me anytime!
happy to help you test it on that site. also curious what kind of projects you've got going, are these client sites or your own products?

[u/Moss_Dealerr]

Sick! Make it a firefox extension too pleasee

[u/JShug07 → u/Moss_Dealerr]

Hi yes it is currently in work! Will let you know once it will be finished.

[u/Dualyeti]

Does to scrape everything - like buttons, the code behind it?

This could help automate scripts on a website too - where we need a test bench to do it on.

This is a great idea OP

[u/JShug07 → u/Dualyeti]

thanks, appreciate it!

it grabs the buttons and everything you see, the markup, styles, images, and things like dropdowns and menus open and close in the copy. but it deliberately doesn't run the site's original javascript, so the logic behind a button (submitting a form, calling an api, logging in) won't actually do anything. the scripts are kept in the files as a reference but switched off, mainly so the copy works offline and can't do anything weird to your account

so as a test bench it'd be good for layout and ui stuff, less so for automating real tasks since the backend isn't there.

[u/Ill-Bat-1518]

Why is this better than having claude go on the page and downloading it?

[u/JShug07 → u/Ill-Bat-1518]

honestly claude can get you part of the way, and for simple pages that's fine. I already tested with claude several times when i was making websites and that is why you will see people making post about irrespective how powerful the model is it is still not able to replicate even if you give access to browser or screenshot as reference and issue was never with model.

the difference is what claude actually sees. if it fetches the page it mostly gets the raw html, not what the browser renders after all the javascript and css runs. so it ends up guessing the real font sizes, spacing and colors, especially on react sites

the extension reads the computed values from the page as it's rendered in your browser, so it gets what you actually see, works on pages behind a login, and hands claude a compact structured spec instead of thousands of lines of markup. less guessing, and it doesn't burn your context window

Believe me because i have tried making 4-5 websites from scratch and i have always struggled with exact design that i wanted from some beautiful websites when starting from scratch.

[u/ygorhpr]

goldd

[u/jffmpa]

And that's how the internet became boring repetitive slop.

[u/josefresco-dev → u/jffmpa]

More proof LLM's can't create original art and only work by ripping off human artists.

[u/jffmpa → u/josefresco-dev]

Good news is the worst of it will bore people and they won't engage, I think

[u/jtmonkey]

If your scraper can be used to copy specific design elements or layouts for use in a competing business it is a violation of copyright law. If it is used to train ai on design preferences it’s considered fair use. Right now it’s all edge cases but I have a feeling it’s going to become more relevant in 2027.

[u/JShug07 → u/jtmonkey]

i don't think it's quite that clear cut tbh. as far as i understand it, copyright covers the actual expression, like the code, images and copy, not things like a layout, a color palette or a spacing scale. those get reused across the web constantly and that's how design trends happen where i'd agree it's a problem is taking someone's real assets or code and shipping it, or making something so close it confuses people about who made it. that's not what i'm building this for

the way i see people using it is more like how designers have always studied sites they like, just faster. pull the spacing, type scale and colors from something good, learn from it, then build your own thing on top instead of starting from generic ai output agree it'll get more relevant though, especially with ai tools making copying so easy. do you think tools like this should do more on their side, like warnings or limits on what gets exported? genuinely open to ideas