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

Webflow Clipboard Bridge — Copy Elements Between Browsers

Webflow puts elements on the clipboard in a special format that doesn’t travel between browsers (Firefox → Chrome, Safari → Edge…). Open this page in the browser where the Designer runs, paste here, and copy again — the paste works.

Mis à jour le
Click here and press Ctrl/⌘+V
Paste elements copied in the Webflow Designer or from any devpack “Copy to Webflow” button — from any browser.
Then select an element in the Designer (or Navigator) and press Ctrl/⌘+V.
Clipboard JSON (advanced — edit class names or text, then copy)

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 : Webflow Clipboard Bridge

  1. Copy the element: in the Webflow Designer (select it and press Ctrl/⌘+C) or with a devpack “Copy to Webflow” button.
  2. Open this page in the browser where the Webflow Designer is open, click the paste area and press Ctrl/⌘+V.
  3. Check the summary — elements, classes and assets found — and optionally edit the JSON.
  4. Click Copy to Webflow, then paste into the Designer.

Why copying between browsers fails

When you copy elements, Webflow (and tools like devpack) put them on the clipboard as application/json in Webflow’s @webflow/XscpData format. Only plain text and HTML are shared between browsers in a standard way — custom types like this are stored in each browser’s own private format. So a copy made in Firefox arrives in Chrome as plain text, and the Designer ignores it. The same happens between Safari, Edge, Arc, Brave and Chrome profiles in some setups.

The plain-text copy still contains everything, though. This page reads it, checks it, and writes it back to the clipboard as application/json in the current browser — which is exactly what the Designer expects.

Good to know

  • Same browser, same clipboard: if devpack and Webflow are open in the same browser, you don’t need the bridge — paste straight into the Designer.
  • Between Webflow projects: copying elements between sites works in one browser too; classes are recreated, and images are re-linked from the original site’s assets.
  • Save components for later: download the JSON and reopen it any time — a lightweight snippet library for sections you reuse.
  • Nothing is uploaded: the clipboard data stays in your browser.

Generate Webflow elements with HTML & CSS to Webflow, SVG to Webflow or the HubSpot Form Styler.

Aussi recherché comme : webflow paste not working, webflow copy between browsers, webflow clipboard, xscpdata, webflow copy paste chrome firefox, webflow clipboard json, paste into webflow, webflow copy elements between projects.

Outils complémentaires : Webflow Clipboard Bridge

  • Class Name Generator — Describe a section in plain words — “hero with tagline, heading, two buttons and an image on the right” — and get a consistent class structure in Client-First, BEM or simple kebab-case, ready to copy into Webflow as elements.
  • Class Name Typo Checker — Paste HTML or enter a URL to audit every class name: catch typos like hero_heding, duplicates spelled differently (hero-title vs hero_title), auto-named Webflow classes like div-block-12, and Client-First or BEM rule breaks.
  • Markdown to Webflow Rich Text — Paste Markdown, check the preview and copy it as formatted rich text — headings, lists, links and bold text land correctly in Webflow’s Rich Text element.
  • WordPress to Webflow Redirects — Moving a site from WordPress to Webflow changes almost every URL: dated blog paths, /category/ archives, trailing slashes and page slugs.

Questions fréquentes

Why does paste into Webflow do nothing?
Usually the copy came from a different browser. Webflow’s element data only survives copy-paste inside one browser. Paste it into this page in the Designer’s browser and copy again.
Does this work for elements copied from the Webflow Designer itself?
Yes. Copy elements in the Designer in one browser, paste them here in another browser, then copy and paste into the Designer there.
Can I edit the copied elements?
Yes — open “Clipboard JSON”, change text or class names, and click Copy to Webflow. For a visual editor with the Navigator, a live preview and class prefixes, use the Webflow Component Editor.
Is my data sent anywhere?
No. Reading, checking and copying happen entirely in your browser.
Puis-je installer Webflow Clipboard Bridge en tant qu’application web et l’utiliser hors ligne ?
Oui. Webflow Clipboard Bridge 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