devpack
EnglishEspañolPortuguêsBahasa IndonesiaFrançaisРусскийDeutschTiếng Việt
Audit du site

Coller SVG et HTML dans Webflow – Extension gratuite

Copiez du SVG, du HTML ou une partie de n'importe quelle page web, appuyez sur Ctrl+V (⌘+V sur Mac) dans le Webflow Designer, et le contenu s'insère sous forme d'éléments Webflow natifs. Gratuit, sans compte, et tout s'exécute sur votre appareil.

Ajouter à ChromeAjouter à Firefox

Edge, Brave, Opera, Vivaldi et Arc l'installent depuis le Chrome Web Store.

SVG en éléments natifsLes icônes issues de Figma (« Copy as SVG »), de sites d'icônes, de code ou d'un fichier .svg deviennent des Custom Elements svg et path que vous pouvez styliser, ou un Code Embed.
HTML en éléments natifsLes classes sont conservées, et le CSS présent dans <style> devient des classes Webflow avec breakpoints, états au survol et classes combinées.
N'importe quelle page webLe contenu copié devient des Headings, Paragraphs, Lists, Links et Images, sans les styles de la page.
Bibliothèque de composantsEnregistrez les éléments copiés dans le Designer, puis collez-les à nouveau avec de nouveaux textes, liens et images.
ConfidentielAucune requête réseau et aucune analyse d'audience. Seule l'autorisation de stockage est demandée.
GratuitSans compte, sans limite, sans publicité.

Mode d'emploi

  1. Ajoutez l'extension à votre navigateur.
  2. Copiez un SVG, un code HTML ou une partie de page web.
  3. Dans le Webflow Designer, sélectionnez l'emplacement souhaité et appuyez sur Ctrl+V (⌘+V sur Mac).

Les collages dans les champs de texte et les éditeurs de code, ainsi que les éléments Webflow natifs et le texte brut, ne sont pas modifiés : le copier-coller habituel continue de fonctionner.

Bibliothèque de composants

Copiez des éléments dans le Designer et cliquez sur Save to devpack, ou appuyez sur Alt+Shift+L pour ouvrir la bibliothèque. Choisissez un composant, renseignez son texte, ses liens, ses images et ses icônes, puis cliquez sur Paste into Designer. Vous choisissez les parties modifiables dans le Webflow Component Editor, et les deux outils affichent la même bibliothèque.

Paramètres

  • Activez ou désactivez l'extension.
  • Choisissez ce qui doit être converti : SVG, code HTML, contenu de page web.
  • Pour le SVG : éléments natifs ou Code Embed, nom de classe, taille et currentColor.
  • Calibrer : collez un Custom Element copié dans les paramètres pour que l'extension apprenne le format actuel de Webflow.
NavigateurInstaller depuis
Chrome, Microsoft Edge, Brave, Opera, Vivaldi, ArcChrome Web Store
FirefoxModules complémentaires Firefox (appuyez deux fois sur Ctrl/⌘+V : le premier collage place les éléments convertis dans votre presse-papiers)

Aucune installation requise

Les mêmes convertisseurs fonctionnent sur devpack.app : SVG vers Webflow, HTML et CSS vers Webflow et le Webflow Clipboard Bridge. Convertissez, cliquez sur Copier, puis collez dans le Designer. Consultez tous les outils Webflow.

Confidentialité

L'extension ne fonctionne que sur les pages du Webflow Designer et sur devpack.app. Elle lit le presse-papiers lors d'un collage dans le Designer pour détecter du SVG ou du HTML, le convertit sur votre appareil, et n'envoie jamais votre presse-papiers, vos créations ni votre activité de navigation vers un serveur. Les détails figurent dans la politique de confidentialité.

Questions

L'extension est-elle gratuite ? Oui. Elle est gratuite, ne nécessite pas de compte et n'a aucune limite.

Pourquoi faut-il coller deux fois dans Firefox ? Firefox ne permet pas aux extensions de transmettre directement un contenu converti à une page. Le premier Ctrl+V place les éléments Webflow convertis dans votre presse-papiers ; le second les colle.

Puis-je l'utiliser sans rien installer ? Oui : utilisez l'outil SVG vers Webflow ou HTML et CSS vers Webflow, cliquez sur Copier, puis collez dans le Designer.