Framer to Next.js: copy any Framer site into a real codebase

Updated 15 October 2026

Framer has no code export. deframer takes the link of any published Framer site or template and gives you a Next.js project: every page, animation, breakpoint and CMS item, as code you can edit, restyle and host anywhere.

How to copy a Framer site into Next.js

You need Node.js 20 or later and a Google account. The site is built on deframer's server, so there is nothing else to install.

Log in once per computer. Your browser opens; sign in with Google.
npx deframer@latest login
Paste the link of the Framer site or template. deframer builds every page and downloads the project into a folder.
npx deframer@latest create https://yoursite.framer.website ./site
Start it. Packages are already installed.
cd site && pnpm dev

A build usually takes a few minutes. Prefer your AI agent? Paste one prompt into Claude Code or Codex and it runs the same steps: see Use with AI agents.

What you get

Every page as a Next.js route, with sections named in the code (Hero, Features, Pricing), not anonymous divs.
Animations and breakpoints: hovers, scroll effects and page transitions, with desktop, tablet and phone layouts.
The CMS: every collection page with its content.
Images and fonts downloaded into the project, so the site doesn't load anything from Framer.
A map for you and your agent: AGENTS.md explains where each page, text and image lives.

Make it your own

The export is laid out so you can change the look and content quickly:

Every text is in content.overrides.json. Change a headline without touching code.
Every image is listed in MEDIA.md with its page and layer, so you can swap it in seconds.
The palette is in theme.css. Recolour the whole site from one file.
Sections have names, so you (or your agent) can reorder, remove or rewrite them by name.

Still designing in Framer? Run npx deframer@latest sync in the project to pull in changes. Files you edited are kept, and any clash is listed. More in Make it yours.

Check how close it is

Don't take our word for it. deframer verify opens the published site and your export side by side at desktop, tablet and phone width and scores how closely they match. If a part of a site can't be converted, you still get a working project: DEFRAMER_REPORT.md lists what was left out, and deframer sync picks up the fix later. See Check an export.

Every way to get a Framer site out as code

Way	What you get	Cost	Good to know
Framer itself	No code export	—	Framer's help center says it doesn't offer HTML export for self-hosting.
HTML exporters	A static copy of the published pages	Varies by tool	Plain HTML, CSS and scripts. Editing layout or copy means working in generated files.
React Export plugin	React components you select in Framer	$50 or $250 a month	Exports components into your own React app, not a whole site. Needs the Framer project.
Rebuild by hand	Whatever you write	Days of work	Full control, but every animation and breakpoint has to be redone.
deframer	The whole site as a Next.js project	Free preview, then one payment	Every page, animation and CMS item, with named sections ready to restyle.

Sources: Framer Help, “Can I export my website to HTML and self-host it?”; the React Export plugin page on the Framer Marketplace. Prices as listed on 15 October 2026.

What it costs: Framer, a designer, or deframer

Keeping a site on Framer's Pro plan costs $30 a month, billed yearly: $360 every year, for each site, for as long as it stays on Framer. Hiring a freelance Framer designer to build a site usually costs $1,500 to $5,000, before any change you ask for later.

deframer is one payment: $39 once until 1 November. It turns any Framer site or template into a codebase you own, so you start from a finished design instead of an empty page, and you host it where you choose, on a free or low-cost plan if you like.

Option	Cost	What you pay for
Framer Pro plan	$360 a year, every year	Hosting and editing one site on Framer
Freelance Framer designer	$1,500 to $5,000 per site	Someone designing and building the site for you
deframer Lifetime	$39 once until 1 November	Every page of every site as Next.js code, re-sync forever

Over three years, Framer Pro alone comes to $1,080 for one site. deframer is paid once, for every site, with a 30-day money-back guarantee. Hosting your code is billed by the host you pick.

Sources: Framer pricing (Pro, yearly billing); Goodspeed, “How to find the best Framer developer for hire” (freelance rates, citing Contra's 2026 hiring guide). Checked 15 October 2026.

Questions

Can you export a Framer website to Next.js?

Framer itself has no code export. deframer reads the published site and builds a Next.js project from it: every page, animation, breakpoint and CMS item, as code on your computer.

Does it work with any Framer site or template?

Yes. Paste the link of any published Framer site or template, on a framer.website address or a custom domain. You don't need access to the Framer project.

Is it HTML or real React code?

Real code: a Next.js app with React pages, named sections, every text in one file and the colours in one stylesheet. You run it with pnpm dev and build it like any Next.js project.

Do the animations and the CMS still work?

Yes. deframer runs Framer's own runtime inside the app, so hovers, scroll effects, page transitions, breakpoints and CMS pages keep working. deframer verify scores how closely your export matches the live site.

Can I change the design after the export?

Yes. Change texts in content.overrides.json, swap images listed in MEDIA.md, recolour the site in theme.css, or ask your AI agent to change sections by name. Run deframer sync to pull in later Framer changes; your edits are kept.

Where can I host it?

Anywhere a Next.js app runs: Vercel, Netlify, Cloudflare, Coolify, Docker or your own server. Images and fonts are downloaded into the project, so it doesn't depend on Framer's servers.

How much does it cost?

A preview of your landing page is free, with no card. Lifetime is $39 once until 1 November: every page of every site, re-sync forever, with a 30-day money-back guarantee. For comparison, Framer's Pro plan is $360 a year per site, and a freelance Framer designer usually charges $1,500 to $5,000 per site.

Try it on your site

See your Framer landing page running as code first, for free and without a card. Preview my site free →