Export Webflow to Markdown
.md and .mdx with proper front-matter, so the output drops straight into Next.js, Astro, Contentlayer, or any static-site generator that reads Markdown from a folder.Why Markdown, not HTML
Webflow's native export gives you static HTML and the Designer API returns rich text as an HTML string. That's usable, but it's the wrong shape if you're rebuilding on a framework that already has its own renderer. You don't want Webflow's nested <div> wrappers around every paragraph — you want the text.
Markdown is portable in a way HTML isn't. The same posts/2026-01-launch.mdfile works in MDX, Hugo, Eleventy, Astro's content collections, Contentlayer, VitePress, and a dozen other places. Move hosts, change framework, switch CMS — the content keeps working.
What you get from each CMS field type
| Webflow field type | Markdown output | Front-matter key |
|---|---|---|
| Plain text | Stored as front-matter string | matches slug |
| Rich text | Body of the .md file, converted to Markdown | — |
| Image | Asset downloaded; relative path in front-matter | image / cover / etc. |
| Multi-image | Array of relative paths | gallery |
| Reference | Slug of the referenced item | matches field name |
| Multi-reference | Array of slugs | matches field name |
| Option (select) | String value | matches field name |
| Switch | Boolean | matches field name |
| Date | ISO 8601 string | date / publishedAt |
| Color | Hex string | matches field name |
| Number | Number | matches field name |
| Link | URL string | matches field name |
Every collection comes out as JSON, Markdown, and MDX side-by-side — pick whichever your stack reads.
How the conversion works
- 1
Pages and collections are fetched via the Webflow API
We use Webflow's read-only API with the token you provide. For each collection, every item — including draft and archived if you opt in — is pulled with all fields and references resolved.
- 2
Rich text is converted HTML → Markdown
The HTML returned by Webflow goes through a conversion pass that preserves headings, lists, code blocks, blockquotes, tables, inline formatting, and embedded media. Webflow's wrapper
<div>s and class attributes are dropped — what survives is real semantic Markdown. - 3
Assets are downloaded and re-pathed
Every image inside rich text and every asset referenced by an image field is downloaded into
assets/and the Markdown is rewritten to point at the relative path. No remaining dependency onuploads-ssl.webflow.com. - 4
Front-matter is assembled per item
All non-rich-text fields become YAML front-matter at the top of each file. Slugs, dates, references, and booleans all keep their native types — your build tool reads them as typed values, not strings.
- 5
Output is bundled as a ZIP
You download a single archive. Inside: one folder per collection, one
.mdfile per item, oneassets/folder, plus parallel.mdxand.jsoncopies if you want them.
Example: a Blog Posts collection
Given a Webflow collection called Blog Posts with fields Title, Slug, Published date, Cover image, Excerpt, and Body (rich-text), the export produces files like:
blog-posts/
the-case-against-cms.md
shipping-faster.md
why-we-left-webflow.md
assets/
cover-the-case-against-cms.jpg
cover-shipping-faster.jpg
inline-1-shipping-faster.pngEach .md file opens to something like:
---
title: The case against CMS
slug: the-case-against-cms
date: 2026-04-12
cover: ./assets/cover-the-case-against-cms.jpg
excerpt: We spent two years building on a CMS. Here's what we learned.
---
We spent two years building on a CMS, and the thing nobody tells you
is that the migration is never the hard part. The hard part is the
**ten-year** habit of editing a record instead of editing a file.
## What changed when we left
...Drop straight into Next.js, Astro, or Contentlayer
The output shape is the one these tools expect, which means there is usually no glue code to write:
- Next.js + MDX: point
@next/mdxat the folder, or feed it into the App Router withgenerateStaticParamsover the file list. - Astro content collections: drop each collection folder into
src/content/and define a matching Zod schema. The front-matter keys align by default. - Contentlayer: point it at the folder and add field definitions — done.
- Hugo: the folder is already shaped like a Hugo content directory; copy it under
content/and you're live. - Eleventy: place under
src/posts/and the collection auto-builds.
FAQ — Webflow to Markdown
- Does the Markdown preserve formatting from Webflow rich text?
Yes. Headings, lists, code blocks, blockquotes, tables, links, bold, italic, and inline images all convert one-to-one. Webflow's wrapper divs and CSS class names are stripped.
- What about embedded videos and custom embeds in rich text?
Native Webflow video embeds and custom HTML embed fields are preserved as HTML inside the Markdown — Markdown allows raw HTML, and so does MDX. If you only want pure Markdown, you can post-process those blocks.
- Can I get MDX with JSX components instead of plain Markdown?
Every file is exported as both
.mdand.mdx. The MDX version is the same content with the.mdxextension, ready for you to swap in React components for callouts, embeds, or anything else.- How are CMS references handled?
Single references export as the slug of the referenced item. Multi-references export as an array of slugs. Resolving them at build time is one lookup per slug — typically a
Mapkeyed by file name.- Do I need a paid Webflow plan?
No. A free Webflow workspace can generate an API token, which is all the exporter needs. See exporting Webflow without a paid plan for the full setup.
- Does it work with large CMS collections?
Yes — pagination is handled automatically and assets are streamed during download to keep memory low. Collections with several thousand items export in a single pass.
Ready to try it?
Paste a Webflow API token, scan the site for free, and only pay when you download. Every page, asset, and CMS item is included.
Related
Last updated May 19, 2026