Cette page n’est pas encore traduite en français : elle s’affiche en anglais.

HTML to Webflow Rich Text Cleaner

Paste messy HTML — from an old site, WordPress export, Google Docs or Word — and get clean semantic markup that Webflow’s Rich Text element and CMS import accept without junk.

Mis à jour le
Clean preview

Clean HTML (CSV import / API)

Vos données ne quittent jamais votre ordinateur. Tout le traitement se fait localement dans votre navigateur.

devpack.app est un outil indépendant, non affilié à Webflow, Inc. ni à Figma, Inc., et n’est ni sponsorisé ni approuvé par eux. Webflow et Figma sont des marques de leurs propriétaires respectifs.

Comment utiliser : HTML to Webflow Rich Text

  1. Paste HTML source — or copy formatted text from Google Docs, Word or a web page and paste it straight into the box (the formatting is captured as HTML).
  2. The tool removes classes, IDs, inline styles, data attributes and layout wrappers, and turns bold/italic styling into <strong>/<em>.
  3. Click Copy rich text and paste into a Webflow Rich Text element or CMS field — or copy the clean HTML for a CSV import.

Why clean HTML before importing into Webflow?

Webflow’s Rich Text element supports a focused set of tags: headings, paragraphs, links, bold, italic, lists, quotes, images, figures and line breaks. Content migrated from WordPress or another CMS — or copied from Google Docs and Word — arrives wrapped in <div>s and <span>s with classes, inline styles (font-family, color, font-size), data-* attributes and empty paragraphs. Imported as-is, that junk overrides your Webflow typography, creates inconsistent spacing and bloats the CMS.

What the cleaner does

  • Removes every class, id, style and data attribute (keeps href/target/rel on links and src/alt on images).
  • Unwraps div, span, section, font and similar wrappers; turns text-only divs into paragraphs.
  • Converts Google Docs/Word styling (font-weight:700, font-style:italic) into semantic <strong> and <em>.
  • Strips scripts, iframes, forms and SVGs; optionally converts H1 to H2 (the page title is usually the H1) and removes empty paragraphs and &nbsp;.

Bulk migrations

For a whole blog, clean each post’s body and import it through Webflow’s CMS CSV import or API — both accept HTML for Rich Text fields. Writing new content in Markdown? Use Markdown to Webflow Rich Text instead.

Aussi recherché comme : webflow rich text, clean html, strip classes, remove inline styles, webflow cms import, google docs to webflow, wordpress to webflow.

Outils complémentaires : HTML to Webflow Rich Text

  • HTML to Markdown — Paste HTML — or copy rich text straight from a web page, Google Doc or email — and get tidy Markdown you can drop into a README, wiki or static site.
  • HTML Formatter — Paste minified or messy markup and get clean, consistently indented HTML — including embedded <style> and <script> blocks.
  • SVG to Webflow — Paste an SVG from Figma and copy it to Webflow as real Custom Elements — every <svg>, <path> and <g> becomes an element you can select, class and edit in the Navigator.
  • Smart Quotes to Straight Quotes — Code copied from Slack, Notion, Word or a blog won’t run?

Questions fréquentes

Why does pasted text in Webflow keep the wrong font?
Content copied from Docs, Word or other sites often carries inline styles. Clean it here first so Webflow’s own Rich Text styles apply.
Does Webflow Rich Text support tables?
Not natively. Tables are replaced with a note by default — add them back with an Embed element inside the rich text.
Are images kept?
Image tags are kept (src and alt only). For best results upload images to Webflow’s Assets so they get responsive sizes.
Can I use the HTML for the Webflow API or CSV import?
Yes — copy the clean HTML output and place it in the Rich Text field column or API payload.
Puis-je installer HTML to Webflow Rich Text en tant qu’application web et l’utiliser hors ligne ?
Oui. HTML to Webflow Rich Text est une application web installable (PWA) : elle s’installe depuis votre navigateur, sans passer par une boutique d’applications. Cliquez sur « Installer l’application » en haut de cette page dans Chrome ou Edge (Windows, macOS, Linux, ChromeOS) ; sur Android, utilisez « Partager » → « Ajouter à l’écran d’accueil » sur iPhone et iPad ; ou « Fichier » → « Ajouter au Dock » dans Safari 17+ sur Mac. L’application s’ouvre alors dans sa propre fenêtre avec sa propre icône, et comme elle s’exécute entièrement dans votre navigateur, elle continue de fonctionner hors ligne. Firefox sur ordinateur de bureau ne permet pas d’installer d’applications web. Comment fonctionne l’installation.

Outils similaires