How to Export Code From Webflow (And Host It Anywhere)
You built something great in Webflow. The design is pixel-perfect, the animations are smooth, and your client loves it. But then you look at the hosting bill - $14 a month for a single static site - and start wondering: can I just export this code and host it somewhere cheaper?
Short answer: yes, you can export Webflow code. But the process of getting your webflow export code running on a different host comes with some caveats that nobody warns you about until you're staring at a broken contact form. Let me walk you through the entire process - what you get, what you lose, and how to actually host your exported site on any static host.
What Does Webflow Code Export Actually Give You?
When you export code from Webflow, you get a ZIP file containing clean, semantic HTML, CSS, JavaScript, images, and fonts. It's a fully self-contained static site that you can open in a browser right from your desktop.
Here's what's inside that ZIP:
- HTML files - one per page, with clean class names and structure
- CSS - Webflow's generated stylesheets, including responsive breakpoints
- JavaScript - the Webflow.js library that powers interactions and animations (this is Webflow's runtime that handles things like scroll-triggered animations, tabs, sliders, and navbar toggling)
- Images - everything you uploaded, in the sizes configured in the Designer (worth running these through an optimizer like Squoosh or TinyPNG before deploying)
- Fonts - web fonts bundled locally (or referenced via CDN links)
The code is surprisingly readable. Webflow has gotten better over the years at generating HTML that doesn't make developers cringe. It's not hand-written quality, but it's solid - way better than what most visual builders spit out.
What You Lose After Export
Alright, let's break this down, because this is where people get tripped up. A Webflow export is a snapshot of your static site. Anything that relies on Webflow's backend or hosting infrastructure simply won't work once you move the files elsewhere.
Things that break after Webflow code export:
- CMS content - if you used Webflow's CMS (blog posts, portfolio items, dynamic collections), none of that dynamic content gets exported. You get the template, but not the data that populates it. This is the biggest gotcha.
- Webflow forms - your contact forms will render visually, but submissions won't go anywhere. They rely on Webflow's form handling service, which only works on Webflow-hosted sites.
- E-commerce - product pages, carts, checkout flows - all of it stays behind. Webflow's e-commerce is completely tied to their hosting.
- Some interactions - basic CSS-based animations typically survive the export. Complex multi-step interactions that rely on Webflow's runtime may not work correctly.
- Site search - Webflow's native search feature won't function on an exported site.
- Password protection - page-level password protection is a hosting feature, not something baked into the HTML.
If your site is mostly static pages - a portfolio, a marketing site, a landing page - the export works great. If you're heavily using CMS or e-commerce features, you're going to have a harder time.
Which Webflow Plan Do You Need to Export Code?
Here's the part that trips up a lot of people searching for "webflow free code export" - you cannot export code on Webflow's free Starter workspace plan. Code export requires at least a Core workspace plan.
Quick breakdown of the workspace plans (as of early 2026 - check webflow.com/pricing for current rates):
| Plan | Price | Code Export? |
|---|---|---|
| Starter | Free | No |
| Core | $19/mo (billed yearly) | Yes |
| Growth | $49/mo (billed yearly) | Yes |
| Enterprise | Custom | Yes |
This is a workspace-level feature, not a site-level feature. So you pay for the workspace plan, and then you can export webflow code from any site within that workspace. If you're an agency with multiple client sites, one Core plan covers all of them.
The workaround for free plan users: Honestly, there isn't a clean official workaround. Some people try inspecting the page source and saving it manually, but you'll miss Webflow's bundled JS and interactions, and the code quality won't match a proper export. If you're serious about owning your code, the Core plan is the most reliable path.
How to Export Webflow Code (Step by Step)
The actual webflow code export process is straightforward once you're on the right plan. Here's how to do it:
- Open your project in the Webflow Designer
- Click the "Export" button in the top-right toolbar (it looks like a box with an arrow pointing out)
- Choose "Export Code" from the dropdown
- Select what to export - you can export the entire site or individual pages
- Click "Prepare ZIP" - Webflow will package everything up
- Download the ZIP file to your computer
Once you've got the ZIP, unzip it and you'll see a clean folder structure with your HTML files at the root level and assets organized in subfolders.
Before you move on to hosting, open the index.html file in your browser. Click around. Make sure things look right. Check your animations, hover states, and responsive layouts by resizing the browser window. Catching issues now saves headaches later.
Fixing Forms After Export
This is the number one pain point I see people run into after a Webflow code export, so it deserves its own section.
Your Webflow forms will still render - the HTML is all there - but submissions won't go anywhere because the action attribute points to Webflow's servers. You need to swap in a third-party form backend.
Option 1: Formspree
Formspree gives you a form endpoint you can point your existing HTML form at. The free tier handles 50 submissions per month.
- Sign up at formspree.io
- Create a new form and copy the endpoint URL
- In your exported HTML, find the
<form>tag and change theactionattribute to your Formspree endpoint - Change the
methodtoPOST - Remove any Webflow-specific data attributes from the form element
<form action="https://formspree.io/f/your-form-id" method="POST">
<!-- your existing form fields stay the same -->
<button type="submit">Send</button>
</form>
Option 2: Formspark / Basin / Web3Forms
These work similarly to Formspree - you get an endpoint, swap it into your form's action attribute, and submissions get forwarded to your email or a dashboard. Most have generous free tiers.
Option 3: Netlify Forms (if hosting on Netlify)
If you end up hosting on Netlify, you can just add a netlify attribute to your form tag and it handles everything automatically. But that ties you to Netlify's hosting, which may or may not be what you want.
The fix usually takes about five minutes per form. Not a big deal.
The Cost Argument: Why Agencies Are Moving Off Webflow Hosting
Let's talk numbers, because this is really what drives most people to export webflow code in the first place.
Webflow's Basic site plan is $14 per month per site (as of early 2026 - check webflow.com/pricing for current rates). That's reasonable for one personal project. But if you're a freelancer or agency managing client sites, the math gets ugly fast:
- 5 client sites: $70/month ($840/year)
- 10 client sites: $140/month ($1,680/year)
- 20 client sites: $280/month ($3,360/year)
And that's just the Basic plan. If clients need CMS features, you're looking at $23 per site, which pushes 20 sites to over $5,500 a year.
Meanwhile, static hosting for exported Webflow sites costs a fraction of that - often free for low-traffic sites, and pennies per site at scale. The one-time cost of a Core workspace plan ($19/month) to enable code export pays for itself after exporting just two client sites.
Hosting Your Exported Webflow Site
Once you've got your exported ZIP file and fixed up any forms, you need somewhere to put it. Since exported Webflow sites are purely static - HTML, CSS, JS, and images - any static hosting platform will work. If you're looking for the fastest way to get an exported site live, check out how to host an HTML file online - the same approach works for exported Webflow projects. Here are a few solid options:
GitHub Pages (Free, Developer-Friendly)
Push your exported files to a GitHub repository, enable GitHub Pages in the repo settings, and you've got a live site. Free for public repos with decent bandwidth limits. The downside: you need to be comfortable with Git, and there's no drag-and-drop option.
Netlify (Free Tier, More Features)
Netlify's free tier is generous - with automatic HTTPS, form handling built in, and solid bandwidth allowances (check Netlify's current limits for specifics). You can drag and drop your folder onto their deploy screen or connect a Git repo. The dashboard has a lot going on though, which can feel heavy if you just want to host a static site.
Cloudflare Pages (Free Tier, Fast CDN)
Cloudflare Pages gives you unlimited bandwidth on the free tier and sits on Cloudflare's global CDN. Great performance, but the setup process is more involved - you'll need to connect through Git.
Hostsmith (Drag-and-Drop, Fast CDN)
If you're anything like me, you probably just want the thing to work. Hostsmith is built for exactly this use case - take your exported Webflow code ZIP, drag it onto the page, and get a live URL in under a minute. No Git, no build configuration, no framework selection screens.
Your site gets served from a global CDN, so it loads fast regardless of where your visitors are. The free tier gives you one site with 5,000 monthly visitors, which is plenty for a client preview or a portfolio piece. If you're managing multiple client sites, the Standard plan gives you 5 sites with custom domains and 100,000 monthly visitors - a fraction of what you'd pay keeping those sites on Webflow hosting.
For agencies doing the Webflow-export workflow regularly, this is probably the fastest path from "I have a ZIP file" to "here's the live URL."
If you want a deeper comparison of drag-and-drop platforms, I put together a breakdown of drag-and-drop website hosting options that covers the workflow differences in detail.
Making Your Exported Site Look Professional
A few finishing touches that separate an exported-and-dumped site from one that feels intentional:
- Custom domain - a
.webflow.ioURL screams "template site." Even after export, set up a custom domain on whatever host you choose. If you're building a portfolio website, this is especially important for making a strong first impression. - Favicon - Webflow exports include your favicon, but double-check it's there. A missing favicon is a small thing that clients notice.
- Meta tags and OG images - open your HTML files and make sure your page titles, descriptions, and social sharing images are set correctly. Webflow exports these, but it's worth verifying.
- Performance check - run your exported site through Google PageSpeed Insights. Without Webflow's tracking scripts, you might actually see better scores than you did on Webflow hosting.
- SSL/HTTPS - any decent static host gives you free SSL automatically.
When You Should NOT Export From Webflow
I'm not going to pretend that exporting is always the right call. Keep your site on Webflow hosting if:
- You rely heavily on Webflow CMS - blog posts, dynamic collections, content that non-technical team members update regularly. There's no clean way to replicate this with a static export.
- You use Webflow E-commerce - the entire shopping experience is tied to Webflow's hosting.
- Your client needs to edit content themselves - Webflow's Editor mode lets clients make text and image changes without touching the Designer. This goes away with an export.
- You need Webflow's form handling - if setting up Formspree or a similar service feels like too much friction, keep the built-in forms.
The sweet spot for export is static marketing sites, landing pages, portfolios, and event pages - anything where the content is set once and doesn't change frequently.
Frequently Asked Questions
Here are the most common questions people ask about how to export code from Webflow.
Can I export Webflow code for free?
No. You need at least a Core workspace plan ($19/month billed yearly, as of early 2026) to access the webflow export code feature. The free Starter plan does not include code export.
Does Webflow export CMS content?
No. Dynamic CMS content - blog posts, collection items, and dynamic pages - is not included in the export. You get the page templates but not the data. If you need CMS content, you'll have to manually recreate it or find a migration tool.
Will my Webflow interactions still work after export?
Basic interactions and animations usually work because the exported code includes the Webflow.js library. However, some complex multi-step interactions may not function correctly outside of Webflow's hosting environment. Always test thoroughly after export.
Can I re-import exported code back into Webflow?
No. Webflow's code export is one-way. You cannot take an exported HTML/CSS/JS package and import it back into the Webflow Designer. Keep your Webflow project intact in case you need to make design changes later.
How often can I export my Webflow site?
As often as you want. There's no limit on the number of exports. Many designers iterate in Webflow, export, and re-deploy whenever they make changes. It's a bit of a manual process, but it works.