Your first screen
Copy a free design, paste it into your agent, and get it running. Five minutes end to end.
Walk through it
- Open a free design, for example Clean Settings. Tap around the preview first; it is the real thing running.
- Press Copy prompt. Nothing else is needed, no account, no setup.
- Open your agent in your Expo project and paste. Send it.
- The agent writes the files, runs npx expo install, and tells you where it put things.
- Start the app. If this is the first design in the project, add the font loading snippet the prompt gave you to your app root.
What you should see
The screen in your simulator should be indistinguishable from the preview on the site: same colors, same type, same spacing, and the same entrance animation on first mount. If any of those differ, something in the paste went wrong rather than the design being approximate.
Start a fresh conversation for the paste
Prompts are large and precise. Pasting into a long session where your agent already has strong opinions about your codebase is the most common reason a design comes out re-themed.
Then make it yours
Once it is running and you can see it is correct, ask your agent to re-theme it in a follow-up message. Doing it in that order is the whole point, and it is covered in the next page.
Re-theme the settings screen I just added to use our palette:
surface #0F1115, ink #F5F5F7, accent #FF6B4A.
Keep the layout, spacing and motion exactly as they are.