Optimiseur SVG

Nettoyez le balisage vectoriel avant qu'il arrive dans un composant, jeu d'icônes ou paquet de fichiers statiques.

Réglages d'optimisation

Précision numérique2 décimales

Une précision plus faible peut encore réduire le fichier, mais un arrondi agressif peut déformer les chemins. 2 ou 3 décimales sont un bon défaut.

Original
Aucun aperçu
Optimisé
Aucun aperçu
Code de sortie

Comment fonctionne l'optimisation SVG

Retirer les données non rendues

Les exports d'outils de design contiennent souvent métadonnées, commentaires, espaces de noms d'éditeur et balisage invisible qui ajoutent des octets sans changer le rendu.

Réduire la précision des chemins

Des coordonnées comme 10.5432109 peuvent souvent être arrondies à 10.54 sans différence visible, surtout pour des icônes rendues en petite taille.

Inspecter avant d'expédier

L'optimisation doit garder viewBox, attributs fill et stroke, libellés ARIA et identifiants importants quand ils affectent rendu, style, animation ou accessibilité.

Questions fréquentes

Le SVG optimisé sera-t-il flou ?

Non. SVG est vectoriel, donc l'optimisation réduit le balisage sans rasteriser l'image. Le seul risque est un arrondi trop agressif des chemins.

Pourquoi un SVG optimisé peut-il parfois grossir ?

Si le fichier original était déjà fortement compressé ou optimisé à la main, il peut rester peu de choses à retirer. La sortie peut alors être similaire ou parfois un peu plus grande.

Le traitement par lot est-il pris en charge ?

Cette page est conçue pour inspecter et régler un fichier unique. Pour de l'optimisation en lot, utilisez un outil d'étape de build comme SVGO dans votre chaîne de build.

L'optimisation SVG peut-elle casser animations ou styles ?

Oui, si un optimiseur retire identifiants, classes, métadonnées ou précision dont votre CSS ou JavaScript dépend. Prévisualisez le résultat et gardez les attributs importants quand le SVG est interactif.

Les SVG décoratifs doivent-ils inclure des labels d'accessibilité ?

Les SVG décoratifs peuvent souvent être cachés aux technologies d'assistance. Les icônes et illustrations informatives doivent garder titres, libellés ou texte environnant significatifs.