Téléchargez le SVG en ligne de n'importe quelle page

Un <svg> en ligne est dessiné directement dans le HTML : il n'a ni URL d'image ni menu clic droit. SVG Downloader le lit directement dans le DOM, le répare et vous remet le fichier d'origine.

Installer l'extension Lire le mode d'emploi →

Le problème

Pourquoi le navigateur n'enregistre pas le SVG en ligne

La plupart des icônes d'un site moderne sont du SVG en ligne — le balisage vit directement dans le HTML de la page plutôt que dans un fichier séparé. Excellent pour la performance et le style, catastrophique pour l'enregistrement. Aucun src à ouvrir dans un onglet, aucune entrée dans le menu contextuel, et Enregistrer l'image sous… est grisé ou carrément absent.

Les contournements habituels sont mauvais. Capturer l'icône donne une image matricielle floue figée à une taille. Fouiller DevTools, c'est traquer le bon nœud <svg>, copier son HTML externe, le coller dans un fichier, puis découvrir qu'il ne s'ouvre pas faute d'espace de noms. Vous vouliez un fichier de 400 octets ; vous avez récolté une corvée.

Ce que fait SVG Downloader à la place

Ouvrez le popup sur n'importe quelle page : il parcourt le DOM à la recherche de chaque élément <svg>, y compris ceux nichés au fond des composants, le balisage voisin du shadow DOM et les jeux d'icônes répétés. Chacun reçoit un aperçu isolé pour que vous voyiez exactement ce que vous allez enregistrer, hors de la page chargée. Choisissez-en un, et il écrit le balisage d'origine dans un vrai fichier .svg.

Les vrais tracés, pas un rendu recalculé. Ce qui s'enregistre est le SVG qui était dans la page — ses attributs d exacts, son viewBox, sa précision. Il reste net à 16 px comme à 1600 px et reste du texte modifiable que vous pouvez recolorer.
Un xmlns réparé. Le SVG en ligne omet en général l'espace de noms xmlns="http://www.w3.org/2000/svg" parce que le navigateur le fournit. Copié dans un fichier nu, ce SVG ne s'ouvre pas. SVG Downloader le remet, pour que le fichier marche dans Figma, Illustrator, VS Code et tous les navigateurs.
Le nom de fichier est le vôtre. Tapez un nom dans le popup avant d'enregistrer et le fichier arrive exactement ainsi — star.svg, pas téléchargement (3).svg. Laissez vide et il retombe sur un svg-1.svg numéroté, avec le préfixe défini dans les options de l'extension.

Ce que vous récupérez

Format: Un fichier .svg conforme aux standards — le balisage vectoriel d'origine, espace de noms réparé.
Fidélité: Chaque tracé et chaque viewBox préservés. Indépendant de la résolution et toujours recolorable.
Où ça tourne: Entièrement dans votre navigateur. Le SVG en ligne ne quitte jamais la page — pas d'envoi, pas de serveur.
Gère aussi: Les fonds CSS, les références de sprite et le ZIP de page entière.

Bon à savoir

Questions sur le SVG en ligne

Pourquoi le clic droit ne permet-il pas d'enregistrer un SVG en ligne ?

Parce qu'un <svg> en ligne fait partie du document, ce n'est pas une image avec sa propre adresse. Le navigateur ne propose Enregistrer l'image sous… que pour ce qu'il traite comme des images — <img>, fonds CSS, canvas. Le SVG en ligne n'a aucune URL à enregistrer, donc l'option n'apparaît jamais.

Le SVG copié depuis DevTools ne s'ouvre pas. Pourquoi ?

Presque toujours un espace de noms manquant. Le SVG en ligne compte sur l'analyseur HTML pour savoir que c'est du SVG ; un fichier autonome exige un xmlns="http://www.w3.org/2000/svg" explicite. SVG Downloader l'ajoute automatiquement, ses fichiers s'ouvrent donc partout sans retouche.

L'icône téléchargée gardera-t-elle sa couleur ?

Elle garde la couleur inscrite dans le balisage. Beaucoup d'icônes en ligne héritent leur couleur du CSS (currentColor), le fichier enregistré peut donc être noir. Si vous voulez d'abord verrouiller une couleur précise, passez par le SVG Color Changer, puis enregistrez.

Attrapez cette icône en deux clics

Gratuit, privé, et il lit le SVG en ligne que le navigateur fait mine d'ignorer.

Installer l'extension Toutes les fonctions →