Optimiseur SVG

Le SVG Optimizer est un outil en ligne gratuit qui réduit la taille des fichiers SVG en supprimant les métadonnées d'éditeur, les commentaires, les attributs par défaut et la précision excessive. 100% côté client, sans téléversement. Il fonctionne entièrement dans votre navigateur, sans installation ni inscription.

Non. L'optimiseur s'exécute entièrement dans votre navigateur à l'aide du DOMParser natif. Les fichiers ne quittent jamais votre appareil.

Une heuristique approximative d'environ 30% de la taille en texte brut, typique d'un balisage SVG bien structuré. La compression réelle du CDN peut légèrement varier.

Ce sont le principal moyen par lequel les lecteurs d'écran annoncent le contenu SVG. Conservez-les pour les ressources publiques ou d'interface ; ne les supprimez que des images purement décoratives.

Oui, le SVG Optimizer est 100% gratuit, sans inscription, sans frais cachés et sans limite d'utilisation. Tout le traitement s'effectue localement dans votre navigateur, garantissant une confidentialité totale.

Absolument. Le SVG Optimizer traite tout côté client, dans votre navigateur. Aucune donnée n'est envoyée ni stockée sur un serveur. Votre contenu reste privé sur votre appareil à tout moment.

Oui, le SVG Optimizer est entièrement responsive et fonctionne sur smartphones et tablettes. Vous pouvez l'utiliser sur n'importe quel appareil doté d'un navigateur web moderne, sans aucun téléchargement d'application.

Aucun compte ni inscription n'est nécessaire. Ouvrez simplement le SVG Optimizer dans votre navigateur et commencez à l'utiliser immédiatement. Il n'y a ni barrière d'inscription ni restriction d'utilisation.

Le SVG Optimizer prend en charge un large éventail de formats et de langages populaires. Consultez l'interface de l'outil pour la liste complète des options prises en charge.

Saisissez simplement votre entrée dans le champ prévu, ajustez les paramètres selon vos préférences, et l'outil la traitera instantanément. Vous pouvez ensuite copier le résultat dans le presse-papiers ou le télécharger.

Un compresseur d'image classique agit sur des formats matriciels comme PNG ou JPEG, en sacrifiant des données de pixels pour alléger le fichier. Un SVG, lui, n'est pas du tout composé de pixels : c'est du texte XML qui décrit des formes, donc il n'y a rien à compresser au sens photographique du terme. Un optimiseur SVG réécrit plutôt ce texte : il supprime les caractères dont le navigateur n'a jamais besoin, comme les métadonnées d'éditeur, les commentaires, la déclaration XML, les espaces de noms redondants et les coordonnées poussées jusqu'à douze décimales. Comme le SVG est du texte brut, chaque caractère retiré est un octet réellement économisé sur le réseau, et l'image s'affiche pourtant à l'identique, pixel pour pixel, puisque la géométrie reste intacte. Ce gain est donc sans perte, contrairement à la compression matricielle qui échange qualité contre poids. Collez votre code ci-dessus et l'outil indique exactement combien d'octets chaque passe de nettoyage a supprimés.

Pour la quasi-totalité des graphismes web, deux ou trois décimales suffisent largement. Les applications de design exportent souvent des coordonnées comme 100.000000 ou 50.987654321, mais un écran affiche en pixels entiers, donc les chiffres au-delà du troisième changent rarement un seul pixel visible tout en alourdissant le fichier. Cet outil utilise une précision de trois par défaut et vous laisse choisir de un à six chiffres, en arrondissant chaque attribut numérique et chaque coordonnée de tracé à cette limite, en supprimant les zéros superflus en fin de nombre et en retirant le zéro initial dans des valeurs comme 0.5. Descendez à un ou deux chiffres pour les petites icônes, où les gains sont les plus importants ; ne gardez quatre chiffres ou plus que pour de très grandes illustrations ou des dessins techniques précis, où un arrondi pourrait visiblement déformer une courbe. Utilisez l'aperçu côte à côte pour vérifier que la forme reste correcte après avoir réduit la précision.

Oui, à condition que l'optimiseur soit capable de repérer précisément quels identifiants sont réellement référencés — ce qui est le cas ici. Avant de retirer quoi que ce soit, l'outil analyse tout le document à la recherche des identifiants ciblés par url(#id), href="#id" et xlink:href="#id", la façon dont les dégradés, les filtres, les clip paths et les éléments <use> se relient entre eux en interne. Seuls les identifiants que rien ne référence sont supprimés, de sorte que ceux dont dépendent votre CSS, vos animations ou vos symboles réutilisables sont préservés. Le point de vigilance concerne les références externes : si votre JavaScript ou une feuille de style dans un autre fichier cible un élément SVG par son id, l'outil ne peut pas le savoir et risque de le supprimer. Pour des icônes autonomes, c'est rarement un problème, mais si vous manipulez vos SVG en script, vérifiez le résultat ou laissez désactivée l'option "Supprimer les identifiants inutilisés". Essayez ci-dessus et consultez l'onglet de comparaison.

Chaque attribut de présentation SVG possède une valeur par défaut intégrée définie par la spécification, et le navigateur applique cette valeur dès que l'attribut est absent. Ainsi, fill-opacity="1", stroke-width="1", stroke-linecap="butt" et opacity="1" décrivent tous la valeur que l'élément aurait déjà si vous n'écriviez rien du tout. Les inclure est inoffensif mais constitue du poids mort pur — le rendu est identique octet pour octet, avec ou sans eux. Les éditeurs ajoutent ces attributs explicites parce qu'ils sérialisent l'état complet calculé d'un élément, et non le minimum nécessaire pour le dessiner. Cet optimiseur connaît les valeurs par défaut de la spécification et supprime tout attribut dont la valeur correspond à ce défaut, ce qui représente vite un gain notable sur un jeu d'icônes où les mêmes attributs redondants se répètent sur chaque forme. Une précaution : ne retirez les valeurs par défaut que si rien ne les surcharge via CSS, car un attribut supprimé peut laisser un style hérité reprendre le dessus. Collez votre fichier pour voir le nettoyage en action.

SVGO est le célèbre optimiseur en ligne de commande basé sur Node, qui s'exécute dans le cadre d'une étape de build, configuré via des plugins et des fichiers de configuration. Cet outil couvre les mêmes nettoyages à forte valeur ajoutée — suppression des métadonnées d'éditeur, des commentaires, des attributs par défaut, des espaces de noms et identifiants inutilisés, et arrondi de la précision — mais s'exécute entièrement dans votre navigateur, sans installation, sans configuration et sans terminal. C'est donc idéal pour les nettoyages ponctuels : un logo qu'un client vient d'envoyer, une icône récupérée sur Figma, ou un code que vous voulez inspecter avant de le valider. Vous disposez de quatorze options individuelles, d'un aperçu en direct avant/après sur fond en damier, et d'une comparaison octet par octet, pour voir exactement ce qui a changé plutôt que de faire confiance à un résultat de build silencieux. Pour une chaîne d'assets récurrente, l'automatisation de SVGO reste la meilleure option ; pour une optimisation interactive rapide, collez votre SVG ci-dessus et téléchargez le résultat.