--- title: "Framer to Astro: How to Migrate a Framer Site — Dardo" description: "Framer has no HTML export. How to move a Framer site to Astro: what to capture, how to rebuild CMS, motion and forms, and how to keep URLs and SEO." url: "https://dardo.studio/en/blog/framer-to-astro/" language: "en" translations: {"es":"https://dardo.studio/es/blog/migrar-de-framer-a-astro/","fr":"https://dardo.studio/fr/blog/migrer-framer-vers-astro/","de":"https://dardo.studio/de/blog/framer-zu-astro-migrieren/","it":"https://dardo.studio/it/blog/migrare-da-framer-ad-astro/","pt":"https://dardo.studio/pt/blog/migrar-de-framer-para-astro/","nl":"https://dardo.studio/nl/blog/framer-naar-astro/","sv":"https://dardo.studio/sv/blogg/migrera-framer-till-astro/","pl":"https://dardo.studio/pl/blog/migracja-z-framera-do-astro/","uk":"https://dardo.studio/uk/blog/framer-to-astro/","ru":"https://dardo.studio/ru/blog/framer-to-astro/","ar":"https://dardo.studio/ar/blog/framer-to-astro/","hi":"https://dardo.studio/hi/blog/framer-to-astro/","th":"https://dardo.studio/th/blog/framer-to-astro/","ja":"https://dardo.studio/ja/blog/framer-to-astro/","ko":"https://dardo.studio/ko/blog/framer-to-astro/","zh-Hans":"https://dardo.studio/zh-Hans/blog/framer-to-astro/","zh-Hant":"https://dardo.studio/zh-Hant/blog/framer-to-astro/"} updated: "2026-10-12T23:14:25.145Z" --- [Blog](https://dardo.studio/en/blog/) # Framer to Astro: how to move a Framer site without losing its design or rankings Framer has no HTML export, so moving to Astro is a rebuild. What to capture first, what breaks, and how to keep the design, URLs and rankings. By [Nicolás Cerón](https://dardo.studio/en/studio/) ·October 12, 2026 ![An empty gilded picture frame on an easel in a painter's studio at night, with a crimson thread running from the frame out of an open window and up a hillside path to a lit observatory under the stars.](https://dardo.studio/_astro/01M4S57PW4TH7D1E7E3RQM4Z4E_Z3SVDC.webp) ## Key takeaways - Framer doesn't offer HTML export for self-hosting, so moving to Astro means rebuilding the site, using the published Framer pages as the reference. - Capture every URL, CMS collection, breakpoint and animation before rebuilding, because Framer loads its content, images and code from its own CDN and runtime. - Framer forms and CMS files depend on Framer's runtime; give every form your own endpoint and move CMS content into Astro collections or a headless CMS. - Set 1:1 server-side 301 redirects at your host; a static Astro build without an adapter only produces meta-refresh redirects. - Make sure no canonical, sitemap entry or Open Graph tag still points at the old Framer address after launch. ## The short answer Framer's own help center says it "does not offer HTML export for self-hosting" ([Framer Help](https://www.framer.com/help/articles/can-i-export-my-website-to-html-and-self-host-it/)). So moving from Framer to Astro is a rebuild, not an export. You capture the published site as a reference, rebuild each template as Astro components, move the CMS content into collections, recreate the motion you actually need and give every URL that changes a permanent redirect. Done in that order, the new site can look the same, load less JavaScript and keep its rankings. Skip the capture or the redirect map and you end up with a redesign nobody asked for and a dip in search traffic. ## Why teams move off Framer Framer is a good tool for designing and publishing marketing sites quickly. The reasons to leave are usually practical rather than aesthetic: - **Hosting and ownership.** A Framer site runs on Framer's servers. Teams that want the code in their own repository, on their own host or next to their own backend need a rebuild. - **Plan costs per site.** On Framer's [pricing page](https://www.framer.com/pricing/), checked on 12 October 2026, the Basic plan is USD 10 a month and the Pro plan, which adds site redirects, is USD 30 a month, both billed yearly. Localization is a paid add-on. - **Redirect limits.** Framer redirects only work for paths within the same domain ([Framer Help](https://www.framer.com/help/articles/how-to-setup-redirects-to-maintain-seo-ranking/)). - **Forms, data and integrations** that need a real backend: a CRM, a booking system, gated content or anything that has to run on your own infrastructure. If your marketing team builds and edits pages visually every week and the site does its job, staying on Framer can be the right call. A migration costs design and development time; it should buy something specific. ## What we learned building a Framer capture tool Dardo built an internal tool that captures a published Framer page, for a site you own, and turns it into a standalone reference file plus an Astro migration tracker with one row per thing to rebuild. Building it taught us where Framer sites hide their complexity: - **Assets live on Framer's CDN.** Images, fonts and code load from framerusercontent.com and related domains. Responsive images request the same file at several widths (?width=512, ?width=1024), so the capture keeps one local file per image, the largest one. - **The JavaScript arrives in layers.** Framer loads small modules that only re-export the real bundle, so a single pass misses code. The tool keeps re-scanning until no new module appears. - **CMS content is a separate file format.** Framer CMS collections ship as .framercms files that the page fetches in byte ranges from the CDN. On an ordinary static host those requests return the whole file, and the module that builds their URLs points back at Framer. - **The runtime rewrites the page after it loads.** Framer's React runtime hydrates the HTML and can re-insert elements you removed. The "Made in Framer" badge, for example, is hydrated into its own container. - **Forms depend on Framer.** The captured forms have no HTML action; submissions only work through Framer's client runtime. - **SEO tags point at Framer.** Unless they're rewritten, canonical and Open Graph URLs keep advertising the original Framer address. - **Motion is data.** Appear effects are stored as JSON payloads in the page, so the tool records them along with every running animation's keyframes and timing. The conclusion we drew: the export is evidence, not the deliverable. We never ship the captured HTML or Framer's runtime. They tell us exactly what to rebuild. ## Framer to Astro, step by step 1. **Inventory every URL.** Start from the site's sitemap.xml, add every CMS page and pull the Pages report from Google Search Console for the longest range available. Note any redirects already set in Framer under Site Settings, Hosting. 2. **Export what Framer allows.** Framer says CMS content can be exported with plugins to formats such as CSV or JSON ([Framer Help](https://www.framer.com/help/articles/porting-your-data-from-framer/)). Download every image and file, and check the licence of each font before self-hosting it. 3. **Capture the published site as a reference.** Record each template at every breakpoint, plus the timing of every animation you want to keep. Our tool captures pages at 1440, 810 and 390 pixels wide, then one pixel below, at and above every breakpoint it finds in the site's CSS. 4. **Rebuild templates as Astro components.** Move CMS collections into [content collections](https://docs.astro.build/en/guides/content-collections/) or a headless CMS, images into [astro:assets](https://docs.astro.build/en/guides/images/), and localized pages into [Astro's i18n routing](https://docs.astro.build/en/guides/internationalization/), one URL per language. 5. **Recreate the motion that carries meaning.** Most Framer effects become CSS transitions, keyframes or a small script. Respect prefers-reduced-motion. In one of our own Framer-to-Astro rebuilds, an 18-route site that wasn't a client project, 217 of 219 scroll and interaction states matched the original within a 1% pixel difference. 6. **Give every form a real endpoint.** Point each form at your own handler (a Cloudflare Worker, a form service or your CRM) and test delivery on staging. 7. **Carry over search metadata.** Titles, descriptions, Open Graph tags, structured data and a self-referencing canonical on every page, plus a fresh XML sitemap. 8. **Redirect at the server, not in HTML.** A static Astro build without an adapter turns configured redirects into meta-refresh pages that have no HTTP status code ([Astro configuration reference](https://docs.astro.build/en/reference/configuration-reference/)). Set 1:1 301 redirects where the site is hosted, for example in a Cloudflare \_redirects file or a Worker. 9. **Launch, then watch.** Switch DNS, keep the Framer project until the new site is verified, and follow Search Console's indexing and Pages reports for the next few weeks. Our [website migration SEO checklist](https://dardo.studio/en/blog/website-migration-seo-checklist/) covers launch day and the 90 days after it. ## What changes after the move | Area | On Framer | On Astro | | --------- | ------------------------------------------ | ---------------------------------------------------- | | Editing | Visual canvas in Framer | CMS fields or code, depending on what you choose | | Hosting | Framer's servers | Any static host or edge platform, such as Cloudflare | | Redirects | Pro plan; sub-paths within the same domain | Server-side 301s at your host, with no domain limit | | Motion | Built-in effects and interactions | CSS and JavaScript you own and can measure | | CMS | Framer CMS collections | Content collections or a headless CMS | | Forms | Framer's form handling | Your own endpoint and data storage | ## Keeping SEO intact Google's guidance on [site moves with URL changes](https://developers.google.com/search/docs/crawling-indexing/site-move-with-url-changes) applies here: map every old URL to its closest new equivalent, use permanent server-side redirects and keep them for at least a year. If the URLs stay identical, which a careful rebuild can often achieve, you only need to verify that the new pages carry the same content and metadata. The Framer-specific trap is the leftover Framer address. Make sure no canonical, sitemap entry or Open Graph tag still names the old Framer URL, and that the Framer project is unpublished or redirected once the new site is live. ## How Dardo runs a Framer migration We run Framer moves as part of our [website migration](https://dardo.studio/en/services/website-migration/) service: inventory, capture, a representative page rebuilt first and reviewed at agreed widths, then the rest of the templates, forms and redirects. The build itself is [web development](https://dardo.studio/en/services/web-development/) in Astro, and motion work is [creative development](https://dardo.studio/en/services/creative-development/). This site, dardo.studio, runs on Astro on Cloudflare Workers with its content in a headless CMS, which is the setup we use most often. If you're weighing a move, [send us the site and what you want to change](https://dardo.studio/en/contact/?service=website-migration). We'll tell you whether a rebuild is worth it before quoting one. ## Common questions **Can I export my Framer site to HTML?** Not officially. Framer's help center says it doesn't offer HTML export for self-hosting. Tools can capture a published page, but the result still depends on Framer's runtime and CDN, so treat it as a reference for a rebuild rather than something to deploy. **Will I lose my Google rankings if I move from Framer to Astro?** Not if every URL that earns traffic keeps working. Keep paths identical where you can, add permanent 301 redirects for any that change, carry over titles, descriptions and structured data, and watch Search Console for a few weeks after launch. **Can I export my Framer CMS content?** Framer says CMS content can be exported with plugins to formats such as CSV or JSON. Download every image and file as well, because collection fields often point at Framer's CDN. **Can my team still edit the site without code after moving to Astro?** Yes, if the new site uses a headless CMS. Editors work in a web interface and the Astro site is rebuilt from that content. dardo.studio works this way. **Do Framer animations work in Astro?** Not directly. Framer's effects run in its own runtime, so each animation you want to keep is rebuilt with CSS or a small script, ideally with a reduced-motion version. ## Sources & further reading Sources behind this page, with further detail from the original publishers. - [Framer Help: Can I export my website to HTML and self-host it?](https://www.framer.com/help/articles/can-i-export-my-website-to-html-and-self-host-it/) · framer.com - [Framer Help: Porting your data from Framer](https://www.framer.com/help/articles/porting-your-data-from-framer/) · framer.com - [Framer Help: How to set up redirects](https://www.framer.com/help/articles/how-to-setup-redirects-to-maintain-seo-ranking/) · framer.com - [Framer pricing](https://www.framer.com/pricing/) · framer.com - [Astro docs: Content collections](https://docs.astro.build/en/guides/content-collections/) · docs.astro.build - [Astro docs: Images](https://docs.astro.build/en/guides/images/) · docs.astro.build - [Astro docs: Internationalization (i18n) routing](https://docs.astro.build/en/guides/internationalization/) · docs.astro.build - [Astro docs: Configuration reference (redirects)](https://docs.astro.build/en/reference/configuration-reference/) · docs.astro.build - [Google Search Central: Site moves with URL changes](https://developers.google.com/search/docs/crawling-indexing/site-move-with-url-changes) · developers.google.com [Nicolás Cerón](https://dardo.studio/en/studio/) Nicolás Cerón is the founder of Dardo, a brand, web design and development studio in Bogotá, Colombia. ## Related articles - [**Website migration SEO checklist: change platforms or domains without losing rankings**Rankings rarely drop because of the new platform; they drop because URLs that earned traffic stopped answering. A checklist from URL inventory to day 90.](https://dardo.studio/en/blog/website-migration-seo-checklist/) - [**WordPress or a custom website? How to choose, and when each one pays off**When WordPress is the right choice, when a custom site pays off, and the middle path of headless WordPress, compared on cost, speed, updates and ownership.](https://dardo.studio/en/blog/wordpress-vs-custom-website/) - [**3D websites: when they're worth it and how to keep them fast**When a 3D website earns its place, when video or images work better, and how we kept Janus Observatory's ten 3D worlds fast, accessible and usable.](https://dardo.studio/en/blog/3d-websites/) - [**How much does a website cost in Colombia in 2026? Real prices and what moves a quote**Dated, published prices from Bogotá providers, the fixed yearly costs of a domain and hosting, and the factors that actually move a website quote.](https://dardo.studio/en/blog/website-cost-colombia/) ## Keep exploring. - [Service · **Website migration without losing SEO**](https://dardo.studio/en/services/website-migration/) - [Your project · **Start a conversation**](https://dardo.studio/en/contact/)