Optimiseur SVG

Collez ou déposez un SVG et réduisez-le avec SVGO. Tout reste dans votre navigateur.

Comment fonctionne Optimiseur SVG

Optimiseur SVG exécute SVGO (SVG Optimizer) dans un Web Worker à l'intérieur de votre navigateur pour minifier et nettoyer vos fichiers SVG sans les télécharger. SVGO applique un ensemble configurable de plugins qui suppriment les commentaires, réduisent les espaces blancs, fusionnent les chemins identiques, convertissent les formes en leur représentation la plus compacte et suppriment les attributs sans effet visuel. Le résultat est un SVG plus petit qui se rend de manière identique à l'original.

Les fichiers SVG produits par des outils de design comme Figma, Illustrator ou Inkscape contiennent souvent des surcharges significatives : métadonnées spécifiques à l'éditeur, groupes vides, attributs de transformation redondants et déclarations d'espaces de noms dont aucun navigateur n'a besoin. L'ensemble de plugins par défaut de SVGO supprime cette surcharge de manière fiable. Le fichier optimisé est proposé en téléchargement et le pourcentage de réduction de taille est affiché pour vous permettre de confirmer que l'optimisation était utile.

Rédigé par Bastien Sulyan

Comment utiliser Optimiseur SVG, étape par étape

Déposez votre fichier SVG sur la zone de chargement ou cliquez pour parcourir.
Le Web Worker SVGO exécute l'optimisation immédiatement avec l'ensemble de plugins par défaut.
Consultez le pourcentage de réduction et les tailles de fichier original versus optimisé.
Cliquez sur Télécharger pour enregistrer le SVG optimisé sur votre appareil.
Si des plugins spécifiques causent des problèmes de rendu, ajustez la configuration des plugins et ré-optimisez.

Cas d'utilisation courants

Un développeur front-end optimise les icônes exportées de Figma avant de les livrer dans un pipeline de ressources de production, réduisant chaque icône de 4 Ko à moins de 1 Ko.
Un web designer nettoie les illustrations SVG exportées d'Illustrator qui contiennent des couches de métadonnées d'éditeur invisibles dans le navigateur mais qui gonflent le fichier.
Un développeur construisant une police d'icônes depuis des glyphes SVG s'assure que chaque SVG source est propre et structuré de manière cohérente avant l'étape de construction de la police.
Un ingénieur performance audite le SVG en ligne dans le HTML et remplace chaque original gonflé par une version optimisée par SVGO pour améliorer le poids de la page.

Questions fréquentes

SVGO changera-t-il l'apparence de mon SVG ?

Les plugins par défaut de SVGO sont choisis pour être visuellement sans perte : le SVG optimisé se rend de manière identique à l'original dans tous les navigateurs standards. Certains plugins agressifs (comme ceux qui arrondissent très fortement les coordonnées de chemin) peuvent introduire de subtiles différences de rendu. Si vous remarquez un changement visuel, comparez les fichiers original et optimisé dans un navigateur et désactivez le plugin spécifique qui cause le problème.

Le fichier SVG est-il envoyé à un serveur pour l'optimisation ?

Non. SVGO s'exécute dans un Web Worker dans votre onglet de navigateur. Le texte SVG est lu depuis votre disque local, traité en mémoire JavaScript, et la sortie est retournée à la page pour téléchargement. Le contenu du fichier ne quitte pas votre appareil.

De combien mon SVG va-t-il être réduit ?

La réduction dépend de la source. Les SVG exportés depuis des outils de design avec des métadonnées d'éditeur rétrécissent couramment de 30 à 70 pour cent. Les SVG écrits à la main qui sont déjà légers peuvent ne voir qu'une réduction de 5 à 15 pour cent. L'outil affiche les comptages d'octets exacts et le pourcentage pour vous permettre d'évaluer chaque fichier individuellement.

L'optimisation affecte-t-elle les animations SVG ou le JavaScript dans le fichier ?

La configuration préserve les éléments d'animation et les attributs SMIL. Elle supprime en revanche les éléments script : l'outil ajoute le plugin removeScripts au préréglage par défaut de SVGO, parce qu'un SVG que vous vous apprêtez à intégrer n'a pas à transporter du code exécutable. Certains plugins qui nettoient les attributs pourraient interagir avec les animations si l'animation référence ces attributs par ID ; vérifiez la sortie rendue après l'optimisation des fichiers qui utilisent des animations complexes.

Puis-je optimiser plusieurs fichiers SVG à la fois ?

La version actuelle traite un fichier SVG à la fois. Déposez un fichier, téléchargez le résultat, puis déposez le fichier suivant. Le traitement par lot de plusieurs fichiers en une seule session n'est pas disponible dans cette version.

Quelle version de SVGO l'outil utilise-t-il ?

L'outil intègre SVGO s'exécutant dans un Web Worker. La version intégrée est indiquée dans les informations sur l'outil. SVGO est activement maintenu et l'API des plugins a changé significativement entre les versions v1, v2 et v3 ; l'outil actuel utilise le format de plugin v3.

Outils liés

Tout reste local, explorez des outils complémentaires.

Tous les outils image