How to copy a website design with your AI

The library is sorted into shelves, one for each kind of design. Buttons for the main actions on your page, popups for the messages that open over it, and more shelves for sections, forms, banners and widgets.

Each design has its own page with a live demo, so you can see it working before you do anything.

Want to see designs working together? Our demo sites are full websites built only from designs in the library.

Every day, the 10 most copied designs go on the Freebies shelf.

And without creating an account, you can copy up to 10 prompts for free from the Freebies. It's the easiest way to try CopyDesign.

We add new designs every week. The newest designs page always shows the latest 20, so one quick look tells you what just landed.

Every design has its own options. Depending on the design, you can:

• pick from a list, like a color or where the design sits on the page
• slide a number up or down, to pick something like the number of rows or the amount of delay in seconds before the element slides in
• type your own words, like the text on a button
• tick the parts you want to show

Every choice you make goes into the prompt, so your AI builds the version you picked.

The demo at the top of the page updates as you change the options. This way you can try a few options and see live what it would look like, and only copy it when it looks right for you.

Open the Shine CTA Button to try it. Change an option and watch the button change in the demo.

The prompt is a block of instructions we wrote for your AI, with the options you chose already in it.

It describes the design in detail, from what it's made of to how it behaves. It also sets the quality it has to reach, like working on every screen from phones to desktops.

And it tells your AI to use the real content from your site and to ask you for anything it can't find, instead of making things up.

The prompt describes a design, not a piece of code. It never names a tool or a framework, so any AI can read it and build it its own way.

That's the big difference with libraries that hand you code written for one setup. Because often this way the code breaks the moment your setup is different. A clear description doesn't.

The one you already use. ChatGPT, Claude, Gemini, Cursor, whatever you work with.

If your AI can open your project's files, like the one in your code editor, it can add the design to your project for you. If you use a chat, it gives you what to add, and you add it to your site.

Your AI may ask you a few questions first, like which text, links or offers to show. That's normal. The prompt tells it to ask you instead of inventing anything.

Once the design is built, keep talking to your AI in plain words:

• "Make the button a bit bigger."
• "Move it to the bottom of the page."
• "Use the same font as my headings."

And remember to take a look on your phone too.

Tell your AI what you see, in plain words, like "the popup covers my menu" or "the colors don't match my site". It can fix it from there.

Still not right? Tell us on our contact page which design it was and what was off, and we'll improve the prompt.

$20 a month unlocks every design in the library, every design we add later, and unlimited use of the extension.

Prefer to pay once a year? It's $192 a year, so you get 20% off.

You can cancel anytime. You keep access until the end of the period you paid for, and every design you copied with the extension stays in your account library.