Build your first prototype.

1. Find an idea

Drag or scroll the wall to explore. Open search when you know what you need: try “button”, “pricing” or “navigation”. Use filters to narrow the results, or try Starter picks for a smaller selection.

Choose one asset for your first attempt. Save it with the star if you want to return to it on this browser.

2. Preview it, then copy

Open the asset. Try the live preview and its controls. Check how it behaves on a small screen and with reduced motion before deciding whether it fits your project.

Sign in and choose Single file for the simplest starting point. Copy the HTML source into a new plain-text file named index.html, or paste it directly into your assistant. Opening that file in a browser lets you try it on its own.

Free account: 3 distinct copies per UTC day. Membership: unlimited. Other delivery formats appear when the asset supports them.

3. Hand the source to your assistant

Attach the file or paste its complete source. Give the assistant your goal, the part you want to keep and the changes you need. Start with a small request:

Use the attached HTML asset as the starting point for a prototype of my [website or app]. Keep its main interaction. Change the text to [my content] and use [my colours]. Keep it in one HTML file with no extra libraries. Explain how I can open and test it.

Replace the bracketed text with your own details. If your assistant cannot read an attachment, paste the source as text.

4. Make one change, then test

Try the result in your browser. Check the copy, keyboard controls and phone layout. Ask for one change at a time so you can tell what improved.

Review this prototype at phone width. Keep the visual style. Fix any clipped text, small tap targets and keyboard focus problems. Respect reduced-motion settings. Tell me which changes you made and what I should check.

A prototype proves an idea. Before adding real accounts, payments or customer data, connect and test those services separately.