GET/v1/code25 credits

Code

Turn any section of a live website into a clean, self-contained component. Point it at a URL and a CSS selector and it resolves the page's real CSS cascade, then returns paste-ready code - Tailwind, plain HTML + CSS, React (JSX) or Vue - along with the design tokens that section actually uses. Omit the selector and it finds the hero for you.

Give a coding agent a real component to build from instead of a screenshot to guess at.
Rebuild a competitor's pricing section as Tailwind in one call, then restyle it.
Port a section you like into React or Vue without opening devtools.

Parameters

urlrequiredThe page to extract from. With or without protocol (https:// is assumed).

frameworkoptionalThe code you get back. tailwind returns markup with utility classes; html returns markup plus a companion stylesheet; jsx returns a React component; vue returns a single-file component template. tailwind (default) · html · jsx · vue

selectoroptionalThe section to extract, e.g. selector=%23hero or selector=.pricing-card. Omit it and MiroMiro auto-detects the page's hero section and tells you which selector it used. A selector that matches nothing returns 404 with the sections that do exist; invalid selector syntax returns 400. any CSS selector

nameoptionalComponent name for the jsx and vue targets (default: ExtractedSection). Ignored by tailwind and html. a component name

fieldsoptionalComma-separated list of fields to return (e.g. fields=code,tokens). Omit for the full object. url and summary are always included. Trims the response only - the credit cost is unchanged. see the fields table below

fields values

codeThe generated component source, ready to paste.

cssCompanion stylesheet. Only populated when framework=html; null otherwise.

sectionsEvery extractable section on the page, best first - each { selector, label, elements, preview }. List them, pick one, call again with its selector. Always returned, even when you passed your own selector.

tokensThe design tokens THIS SECTION uses: colors, fontFamilies, fontSizes, spacing, radii, shadows.

assetsImages and fonts the section references, as absolute URLs.

selectorThe selector actually used - echoes back the auto-detected one.

autoDetectedtrue when MiroMiro picked the section because you did not pass a selector.

frameworkThe framework the code was generated for.

Build a request

GEThttps://miromiro.app/api/v1/v1/code?url=stripe.com

urlrequired

framework

selector

name

fields

Nothing selected returns the full response.

Options at their default are left out of the URL - the API assumes them. Auth isn't shown here: send your key as an Authorization: Bearer header (see the example below).

Response

Authorization: Bearer mm_live_…

Response fields

urlstringThe resolved URL that was extracted.

selectorstringThe CSS selector used. When autoDetected is true, this is the section MiroMiro chose - pass it back to get the same result.

autoDetectedbooleantrue when no selector was supplied and MiroMiro picked the hero section itself.

sections[]arrayEvery extractable section on the page, best first: { selector, label, elements, hasHeading, preview }. Labels come from each section's own heading, so an agent (or a human) can pick by name and call again with that selector - no devtools needed.

frameworkstringOne of tailwind, html, jsx, vue.

codestringThe generated component, ready to paste.

cssstring | nullThe companion stylesheet - only for framework=html, null for the others.

tokensobjectThe design tokens this section uses: colors, fontFamilies, fontSizes, spacing, radii, shadows.

assets.images[]string[]Absolute URLs of every image the section references.

summary.elementsnumberHow many elements the component contains.

summary.mappedToTailwindnumberDeclarations expressed as a clean Tailwind utility.

summary.arbitrarynumberDeclarations kept as an arbitrary value (e.g. bg-[#0a2540]) because no named utility exists.

summary.truncatedbooleantrue when the section exceeded the 400-element cap and was cut short - pass a narrower selector.

usageobjectMetering for this call: credits spent this month, your monthly cap (null = unlimited), credits remaining, what this call cost (0 on cache hits), and whether it was served from the 24-hour cache.

Example request

https://miromiro.app/api/v1/extract?url=stripe.com&access_key=mm_live_…

← PreviousInstall MCP Next →Brand