How to make ChatGPT match a website's design

ChatGPT can rebuild your site in the style of one you like, if you hand it the real style instead of a description. Here's the 2-minute way to do it.

The fast way

  1. Open the style extractor and paste the URL of the site whose look you want.
  2. Click Extract - you get its colors (with roles: background, text, accents), fonts, type scale, radii and shadows.
  3. Click "Copy for your AI". It bundles the whole style with a short instruction.
  4. Paste it into ChatGPT along with your own page or component and ask it to apply the style.

Why not just say "make it look like stripe.com"?

ChatGPT doesn't have the site in front of it, so it guesses from memory and drifts to a generic approximation. Handing it the exact values - the real hex colors ranked by use, the actual fonts and sizes - grounds the result in what the reference actually uses, so it looks intentional instead of vaguely similar.

Give it roles, not just a list

A flat list of 14 colors is nearly useless - the model can't tell the background from the accent. The extractor labels them (ground, body text, accent) and the copy-for-AI block tells ChatGPT to use the accents only for buttons and links, and to stay inside the palette. That one change is the difference between "close" and "right".

Keep it yours, not a clone

Tell ChatGPT to apply the direction to your own content and to not copy the reference's text or logos. You want the taste, not a duplicate. For a repeatable setup across a whole project, the SlopScrub extension captures references into taste profiles your AI reads over MCP - no re-pasting.

FAQ

How do I make ChatGPT copy a website's design?

Extract the site's real style - colors, fonts, type scale, tokens - and paste it into ChatGPT with an instruction to apply that direction to your own content. SlopScrub's free style extractor gives you a ready-made prompt to paste. Describing the site in words doesn't work; concrete values do.

Will ChatGPT clone the site exactly?

No, and you shouldn't want that. You give it the direction (palette, typography, spacing) to apply to your own content, not the other site's copy, logos or layout. A pixel clone would just be someone else's site.

Does this work with Claude, Cursor and Copilot too?

Yes. Any AI that accepts pasted text works the same way. For coding assistants like Cursor, the SlopScrub extension can also serve the style over MCP so you don't re-paste it each time.