1. Origine
SVG Gobbler est un projet open source créé et maintenu par Ross Moody. L'outil répond à un besoin simple des designers et développeurs web : récupérer facilement les fichiers SVG présents sur une page web, sans passer par l'inspecteur de code. Aujourd'hui utilisé par plus de 75 000 designers et développeurs, il s'est imposé comme la référence de l'extraction SVG en navigation.
2. Utilité
Pour un studio Webflow, SVG Gobbler accélère la collecte d'icônes et d'illustrations vectorielles lors de la veille et de la recherche d'inspiration. Sur les sites qui utilisent des jeux d'icônes SVG custom, l'extension permet de voir précisément quelles icônes sont utilisées et dans quel format elles sont intégrées.
3. Fonctionnalités
SVG Gobbler regroupe l'ensemble des SVG détectés sur la page dans une interface unifiée. Voici les fonctionnalités principales :
- Panneau latéral : prévisualisation de chaque SVG détecté
- Téléchargement direct : en SVG, PNG, WEBP, JPEG ou ZIP
- Copie du markup : export du code SVG brut
- Export avancé : en Data URI ou composants React via SVGR
- Collections : organisation des SVG pour les retrouver facilement
- Optimisation avec SVGO : réduction du poids et suppression des métadonnées inutiles via édition manuelle
- Détection complète : SVG inline dans le HTML et SVG référencés via balise <img>
- Limites connues : les SVG issus de font icons ne sont pas détectés. Les SVG chargés dynamiquement (CORS, iframes, contenu JS) peuvent ne pas apparaître selon le contexte.
4. Cas concrets
→ Un studio qui développe un système d'icônes pour un client visite des sites de référence dans le même secteur. SVG Gobbler extrait les icônes utilisées sur ces sites pour les analyser (style de trait, épaisseur, coins) et s'en inspirer pour définir les spécifications du jeu d'icônes custom.
→ Pour l'analyse technique d'un site concurrent construit sur Webflow, SVG Gobbler révèle si les icônes sont intégrées en inline SVG (animable via CSS/GSAP) ou en img (plus rapide mais moins flexible), des informations utiles pour comprendre les choix d'architecture du studio concurrent.
5. Prix
SVG Gobbler est entièrement gratuit. Aucun compte requis.
→ Installer l'extension : Chrome Web Store
6. Questions fréquentes
SVG Gobbler peut-il extraire des SVG protégés par des droits d'auteur ?
Techniquement oui, mais l'utilisation de SVG extraits d'autres sites sans permission peut violer les droits d'auteur. SVG Gobbler est conçu pour l'analyse et l'inspiration, pas pour la copie directe d'assets commerciaux protégés.
L'outil d'optimisation SVGO intégré modifie-t-il le design du SVG ?
SVGO supprime les métadonnées inutiles et simplifie le code sans altérer l'apparence visuelle dans la grande majorité des cas. Pour des SVG très complexes, il est recommandé de vérifier le résultat après optimisation.
SVG Gobbler détecte-t-il les SVG chargés dynamiquement via JavaScript ?
Il détecte les SVG présents dans le DOM au moment de l'activation de l'extension. Les SVG chargés après interaction utilisateur (scroll, clic) ou soumis à des restrictions CORS peuvent nécessiter une interaction avec la page avant d'activer SVG Gobbler.
SVG Gobbler est-il disponible sur d'autres navigateurs que Chrome ?
Oui, il fonctionne sur tous les navigateurs basés sur Chromium (Chrome, Edge, Brave) ainsi que sur Firefox. Il n'est pas disponible sur Safari.
