StyleScan: Instantly Reverse Engineer Website Design SystemsStyleScan: Instantly Reverse Engineer Website Design Systems
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
Jeet's avatar
Jeet Ajudiya
• 2d
🚀 I built StyleScan for the Paper Challenge
Every website has a design system hidden inside its CSS — colors, fonts, spacing tokens, components. But extracting them manually takes hours.
So I built StyleScan. You paste any website URL, and it reverse-engineers the entire design system in seconds — then syncs it directly to your Paper canvas through MCP.
The unlock was Paper MCP.
Instead of designing cards manually, I connected my agent directly to the canvas. It reads the extracted tokens and builds everything automatically:
Color swatches with hex values
Font family previews
Component style cards
Organized artboards per site
No drag. No drop. Just paste a URL and watch the canvas populate itself.
I tested it on GitHub, YouTube, and my own portfolio — each one created a completely different artboard, reflecting that site's unique visual language.
This is what Paper MCP makes possible — your canvas isn't just a design file anymore. It's a living document connected to the web.
Try StyleScan: https://stylescan-peach.vercel.app
Tech stack: Paper MCP · Node.js · PostCSS · Vercel
paperchallengeVercelAI Agent DesignerPostCSSWeb Design
Isabel's avatar
Contra logo
Isabel Feuerstein
pro
• 19h
this is such a cool use case!
Back to feed
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started