Convertir SVG to PNG avec un arrière-plan transparent

Un flux de travail pratique pour exporter des ressources PNG transparentes à partir de SVG pour l'interface utilisateur, les documents et les créations marketing.

L'exportation transparente PNG échoue souvent en raison de non-concordances de viewBox, de calques d'arrière-plan masqués ou d'anticrénelage des bords. Ce guide vous aide à obtenir une sortie stable.

1) Préparez SVG avant l'exportation

  • Conservez une viewBox valide et supprimez les chemins invisibles surdimensionnés qui agrandissent le canevas.
  • Supprimez les calques d'arrière-plan blanc codés en dur, sauf si la destination l'exige.
  • Alignez les traits et les formes sur la grille de pixels lorsque cela est possible pour réduire les bords flous.

2) Définir les contrôles d'exportation

  • Utilisez le mode d'arrière-plan transparent et vérifiez les pixels alpha dans l'aperçu.
  • Choisissez une échelle 1x/2x/3x en fonction des écrans cibles pour éviter le redimensionnement après l'exportation.
  • Maintenez la stabilité des conventions de nom de fichier afin que la conception et l'ingénierie puissent mapper les actifs en toute sécurité.

3) Exécutez un test QA rapide

  • Testez sur des fonds clairs et sombres pour détecter les halos cachés.
  • Vérifiez le découpage des bords en ajoutant un remplissage temporaire autour du plan de travail.
  • Comparez les dimensions de sortie avec les spécifications de conception avant l'expédition.

FAQ transparente PNG

Pourquoi mon PNG a-t-il toujours une boîte blanche ?
Votre source SVG contient probablement un rectangle d'arrière-plan ou l'arrière-plan d'exportation a été défini sur une couleur unie. Supprimez le calque et exportez avec un fond transparent.
Comment éviter les bords flous ?
Gardez les traits alignés sur les pixels, évitez les transformations fractionnaires et exportez à une échelle appropriée, comme 2x pour l'interface utilisateur de la rétine.
Dois-je optimiser avant ou après l'exportation PNG ?
Optimisez d'abord SVG pour nettoyer le balisage et résoudre les problèmes de géométrie, puis exportez PNG. Cela donne généralement une sortie plus stable.
Le PNG transparent est-il toujours meilleur que le JPG ?
Pour les icônes et les superpositions d'interface utilisateur, oui. Si vous n'avez pas besoin de transparence et avez besoin d'une taille de fichier plus petite pour les photos, JPG peut être meilleur.