Minifier SVG en ligne — Espaces et métadonnées

Minifiez des SVG instantanément. Supprimez les métadonnées d'éditeur et les espaces superflus pour un markup plus léger — traitement dans le navigateur. Pour une optimisation SVGO, utilisez Optimiser SVG.

Chargement…

Optimisation SVG

Minifiez et optimisez du SVG en ligne. Réduisez la taille en supprimant métadonnées et espaces inutiles.

Fonctionnalités

Supprimez les espaces inutiles, commentaires, métadonnées et éléments cachés des fichiers SVG pour réduire la taille tout en préservant la qualité visuelle.

Minifier SVG

Supprimez les espaces inutiles, commentaires, métadonnées et éléments cachés des fichiers SVG pour réduire la taille tout en préservant la qualité visuelle.

Exemple de base

SVG source

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
  <circle cx="50" cy="50" r="40" fill="blue"/>
  <rect x="20" y="20" width="60" height="60" fill="red"/>
</svg>

SVG minifié

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="50" r="40" fill="blue"/><rect x="20" y="20" width="60" height="60" fill="red"/></svg>

Options de minification

Supprimer les commentaires

Supprime tous les commentaires SVG () du code

Comparaison avec/sans l'option :

Code original

<svg>
  <!-- Ceci est un commentaire -->
  <circle cx="50" cy="50" r="40"/>
</svg>

Avec removeComments: true

<svg><circle cx="50" cy="50" r="40"/></svg>

Avec removeComments: false

<svg><!-- This is a comment --><circle cx="50" cy="50" r="40"/></svg>

Réduire les espaces

Réduit les espaces multiples en un seul espace

Comparaison avec/sans l'option :

Code original

<svg>
    <text>   Espaces   multiples   </text>
    <g>  Groupe  </g>
</svg>

Avec collapseWhitespace: true

<svg><text> Espaces multiples </text><g> Groupe </g></svg>

Avec collapseWhitespace: false

<svg><text>   Multiple   spaces   </text><g>  Group  </g></svg>

Supprimer les métadonnées

Supprime les éléments de métadonnées du code SVG

Comparaison avec/sans l'option :

Code original

<svg>
  <metadata>Métadonnées</metadata>
  <circle cx="50" cy="50" r="40"/>
</svg>

Avec removeMetadata: true

<svg><circle cx="50" cy="50" r="40"/></svg>

Avec removeMetadata: false

<svg><metadata>Some metadata</metadata><circle cx="50" cy="50" r="40"/></svg>

Supprimer les attributs vides

Supprime les attributs avec des valeurs vides

Comparaison avec/sans l'option :

Code original

<svg>
  <circle cx="50" cy="50" r="40" id="" class=""/>
</svg>

Avec removeEmptyAttributes: true

<svg><circle cx="50" cy="50" r="40"/></svg>

Avec removeEmptyAttributes: false

<svg><circle cx="50" cy="50" r="40" id="" class=""/></svg>

Supprimer les éléments cachés

Supprime les éléments avec les styles display:none ou visibility:hidden

Comparaison avec/sans l'option :

Code original

<svg>
  <circle cx="50" cy="50" r="40" style="display:none"/>
  <rect x="10" y="10" width="20" height="20" style="visibility:hidden"/>
</svg>

Avec removeHiddenElements: true

<svg></svg>

Avec removeHiddenElements: false

<svg><circle cx="50" cy="50" r="40" style="display:none"/><rect x="10" y="10" width="20" height="20" style="visibility:hidden"/></svg>

Voir les options d’indentation Beautify →

Fonctionnalités

Notre outil d'optimisation SVG offre un ensemble complet de fonctionnalités pour travailler avec les fichiers SVG.

Minifier SVG

Supprimez les espaces inutiles, commentaires, métadonnées et éléments cachés des fichiers SVG pour réduire la taille tout en préservant la qualité visuelle.

Déminifier SVG

Restaurez un formatage lisible du code SVG minifié avec une indentation et des sauts de ligne appropriés pour faciliter l'édition et le débogage.

Optimiser SVG

Allez au-delà de la minification en supprimant les métadonnées d'éditeur, simplifiant les chemins et nettoyant les éléments inutilisés pour une réduction maximale.

Notes développeur

• Le minify rapide sur minify-svg supprime espaces, commentaires et métadonnées d'éditeur sans charger SVGO (~780 Ko). • Activez les options (commentaires, espaces, métadonnées) avant de minifier — tout reste dans l'onglet. • Pour la simplification de chemins et les préréglages SVGO, passez à optimiser SVG après ce premier passage. • Combinez avec valider SVG pour contrôler viewBox ou title/desc avant mise en prod.

Quand les équipes choisissent cette page

• Retirer les espaces d'icônes collées dans du HTML ou des composants React avant commit. • Premier nettoyage d'exports Figma/Illustrator avant optimisation SVGO plus profonde. • Compresser des candidats sprite quand seuls commentaires et espaces doivent disparaître. • Utilisez beautifier SVG ou déminifier SVG pour relire le markup, puis revenez ici pour le minify production.

Outils du cluster SVG

Le minify rapide sur cette page n'est qu'une étape du workflow SVG. Pour les préréglages SVGO, l'aperçu, l'export Data URI, la conversion JSX, le redimensionnement et la validation, ouvrez le hub outils SVG ou allez directement sur optimiser SVG.

Comment fonctionne l'optimisation SVG

L'optimisation SVG va au-delà de la simple minification. Alors que la minification supprime les espaces et commentaires, l'optimisation analyse la structure SVG pour supprimer les métadonnées d'éditeur (Illustrator, Inkscape), simplifier les données de chemin, fusionner les éléments compatibles et supprimer les définitions inutilisées. Cela peut réduire la taille des fichiers SVG de 20 à 60% sans aucun changement visuel.

Optimisation SVG vs Minification — Quelle différence

La minification rapide sur cette page supprime espaces, sauts de ligne et commentaires — idéal avant d'intégrer des icônes inline. L'optimisation SVGO supprime métadonnées, simplifie les paths et nettoie les defs inutilisés — utilisez l'outil optimiser SVG. Les deux préservent le rendu visuel. Complétez avec valider SVG ou le hub outils SVG.