Guide

Copy any website section into your project with AI

Point your AI assistant at a live page and get the section you like back as clean code in your stack: Tailwind, HTML + CSS, React or Vue. MiroMiro reads the page's real CSS, so the colours, spacing and fonts are the site's own values, not a guess from a screenshot.

What you get

The section as paste-ready code (code), in the framework you asked for.
The design tokens that section uses: colours, fonts, font sizes, spacing, radii and shadows (tokens).
Every other section on the page with a ready selector (sections), so you can ask for the next one by name.
The images and fonts the section references, as absolute URLs (assets).

Ask your AI

Not connected yet? Add MiroMiro to ChatGPT, Claude, Cursor or Codex in a minute - see Install MCP. It needs no code, and the free plan includes 300 credits a month.

Authorization: Bearer mm_live_…

Paste into ChatGPT, Claude or Cursor

Name the part of the page you want - hero, header, footer, pricing, features, testimonials, faq or cta - and the assistant passes it as section. If you do not name one, MiroMiro picks the hero. The answer always lists the page's other sections, so a follow-up like "now do the footer" works without you opening devtools.

Or call the API

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

curl

One call costs 25 credits (30 with render=true). Repeating the same call within 24 hours is free, and so is renaming the component with name=.

Reading the result

codeThe component. framework=tailwind (default) gives utility classes, html gives markup plus a stylesheet in css, jsx a React component, vue a single-file component, elementor an importable template (.json), shopify a theme section (.liquid).

sectionsEvery section on the page, best first, each with a selector and a label from its own heading. Pass a selector back to get exactly that block.

summary.styledCoverageHow much of the section the CSS was resolved for. Above 50 is healthy; a low number with a hint means the page builds its styles in the browser.

hintOnly present when something went wrong, and it says what to do - usually retry with render=true.

If it does not work

The code comes back almost unstyled or nearly empty.

The site builds its page with JavaScript (React, Next.js, Framer and similar). Ask again with JavaScript rendering - "use render=true" - and MiroMiro loads it in a real browser first. That adds 5 credits.

It extracted the wrong part of the page.

Look at the sections list in the answer and ask for one by its label or selector, for example "extract the section labelled Powering businesses of all sizes".

I get a 403 or "blocked".

The site refuses automated visitors. render=true gets through most of these. When even the browser is refused, the answer says so, nothing is charged, and that site cannot be extracted.

Can it copy a whole page or a whole site?

One call returns one section, which keeps the code readable. For a full page, ask for the sections one by one. The browser extension can also export a whole page in one go.

Code endpoint reference: every parameter and response field.
Converting whole pages, or not using an AI assistant? See Website to code.
Get a site's brand colours, fonts and logo.
What MiroMiro can and cannot extract.

Try it on your own site first: the free plan includes 300 credits a month, no card needed.

Get a free key