Docs/Agent Quickstart
Agent Quickstart
Give any coding agent (Cursor, Claude Code, ChatGPT) the design of a real site. Paste this prompt, add your key, and it will call the API and build UI in that style instead of guessing.
{
"url": "https://stripe.com",
"selector": "section.hero-section-container",
"autoDetected": true,
"sections": [
{ "selector": "section.hero-section-container", "label": "Financial infrastructure…", "elements": 343 },
{ "selector": "section.business-sizes-section", "label": "Powering businesses of all sizes.", "elements": 604 },
…
],
"framework": "tailwind",
"code": "<section class=\"relative w-full\">\n <h1 class=\"text-[#000000] …\">…</h1>\n</section>",
"css": null,
"tokens": {
"colors": ["#000000", "#533afd"],
"fontFamilies": ["sohne-var"],
"fontSizes": ["48px", "16px"],
"spacing": ["16px", "24px"],
"radii": ["8px"],
"shadows": ["0 2px 4px rgba(0,0,0,.1)"]
},
"theme": "light",
"assets": { "images": ["https://…/hero.png"], "fonts": [] },
"summary": { "elements": 42, "declarations": 310, "mappedToTailwind": 180, "arbitrary": 44, "styledCoverage": 97, "repeatedGroups": 1, "truncated": false },
"usage": { "creditsSpent": 25, "creditsThisMonth": 25, "monthlyLimit": 100, "remaining": 75, "cached": false }
}Agent prompt