Comment convertir un JPG ou un PNG en SVG

Pour convertir un JPG en SVG (ou un PNG en SVG), il faut vectoriser l'image. Le logiciel repère les limites entre les couleurs et les redessine sous forme de formes vectorielles. Un outil de vectorisation dans le navigateur le fait en une étape, et l'éditeur gratuit Inkscape le fait avec Chemin > Vectoriser un objet matriciel. La vectorisation fonctionne bien pour les logos, les icônes et les dessins au trait, et mal pour les photos.

Ce qui se passe quand vous convertissez une image en SVG

JPG, PNG et SVG stockent les images de façons totalement différentes. Un JPG ou un PNG est une grille de pixels colorés. Un SVG décrit des formes en texte : « une courbe d'ici à là, remplie de bleu foncé ». Il n'existe pas de traduction directe entre les deux : un convertisseur doit donc déterminer où se trouvent les formes.

Ce processus s'appelle la vectorisation. Le logiciel regroupe les couleurs proches, suit le contour de chaque groupe et lisse ces contours en courbes. Le résultat est une approximation de votre image construite à partir de tracés. Avec quelques couleurs unies et des contours nets, elle peut sembler presque identique à l'original et s'adapter à toutes les tailles. Avec des dégradés, de la texture et des détails fins, le logiciel doit beaucoup simplifier.

Méfiez-vous des convertisseurs qui sautent la vectorisation. Certains outils enveloppent le JPG ou le PNG dans un fichier SVG et s'arrêtent là. Le fichier se termine par .svg, mais il contient toujours les mêmes pixels et devient flou quand on l'agrandit. Si une machine de découpe, un logiciel de broderie ou un graveur laser refuse votre « SVG », c'est une cause probable. Pour vérifier, ouvrez le fichier dans un éditeur de texte. Si vous voyez un long bloc commençant par data:image/png;base64 ou data:image/jpeg;base64 et peu d'éléments path , le fichier n'a jamais été vectorisé.

Quelles images se convertissent bien en SVG (et lesquelles non)

Bons candidats :

• Les logos avec une poignée d'aplats de couleur.
• Les icônes et illustrations simples.
• Les dessins au trait noir et blanc, tampons et clipart.
• Les signatures et l'écriture manuscrite numérisées à une taille correcte.
• Le texte dans une police grasse et nette.

Mauvais candidats :

• Les photos de personnes, de lieux ou de produits.
• Les images avec des ombres douces, des dégradés ou du flou.
• Les petits fichiers de basse résolution dont les bords sont déjà flous.
• Les JPG très compressés avec des artefacts visibles autour des contours.

Une photo vectorisée en SVG ressemble à une affiche faite d'aplats de couleur. Le fichier peut finir plus lourd que l'original, puisqu'il contient des milliers de minuscules formes. Pour les photos, gardez un format matriciel comme le JPG ou le WebP.

JPG ou PNG : quelle source est la meilleure ?

Le PNG, si vous avez le choix. La compression JPG laisse de légères bavures et ondulations autour des contours nets, et un outil de vectorisation les transforme en bosses et en points parasites. Un PNG du même logo a des contours propres et souvent un fond transparent, ce qui se vectorise bien mieux. Si vous n'avez qu'un JPG, utilisez la plus grande version disponible et nettoyez-la d'abord (conseils ci-dessous). Notre guide des fichiers PNG explique pourquoi ce format préserve les contours.

Convertir un PNG en SVG dans votre navigateur

L'outil PNG en SVG vectorise les images PNG et JPG avec la bibliothèque open source ImageTracer. Il fonctionne entièrement dans votre navigateur : le logo sur lequel vous travaillez n'est envoyé nulle part.

1. Ouvrez l'outil et ajoutez votre PNG ou JPG.
2. Lancez la vectorisation et regardez l'aperçu.
3. Si les contours sont crénelés ou s'il y a trop de points parasites, préparez une image source plus propre ou plus grande et relancez la vectorisation.
4. Téléchargez le SVG.
5. Ouvrez le SVG dans un navigateur et zoomez pour vérifier les courbes avant de l'utiliser.

Vérifiez aussi la taille du fichier. Un logo propre donne généralement un SVG léger. Si le fichier téléchargé est bien plus lourd que l'image source, l'outil a trouvé beaucoup de minuscules formes, signe que la source était trop bruitée ou trop détaillée.

C'est la voie la plus rapide pour un logo ou une icône propre. Pour un design compliqué, attendez-vous à retoucher le résultat dans un éditeur vectoriel.

Pensez à la destination du SVG avant de valider un résultat. Un logo pour un site web doit seulement bien rendre à l'écran : les petites imperfections comptent rarement. Les machines de découpe et les traceurs de vinyle suivent chaque tracé exactement : les points parasites deviennent de minuscules découpes et doivent être supprimés. Pour l'impression, vérifiez que les couleurs vectorisées correspondent aux teintes exactes attendues, car les outils de vectorisation font la moyenne des couleurs proches.

Comment convertir un JPG en SVG dans Inkscape

Inkscape est un éditeur vectoriel gratuit et open source pour Windows, Mac et Linux. Sa vectorisation offre plus de contrôle. Son propre manuel prévient qu'il ne faut pas s'attendre à une copie parfaitement fidèle de l'image, ce qui résume bien la vectorisation en général.

1. Ouvrez Inkscape et importez le JPG ou le PNG (Fichier > Importer, ou faites-le glisser sur le canevas).
2. Sélectionnez l'image.
3. Choisissez Chemin > Vectoriser le bitmap, ou appuyez sur Maj+Alt+B.
4. Choisissez un mode. Seuil de luminosité crée une silhouette d'une seule couleur, adaptée aux logos noirs et aux signatures. Vectorisation de la ligne centrale transforme les traits fins en lignes simples, adaptée à l'écriture manuscrite. Balayages multiples vectorise plusieurs couleurs en calques séparés.
5. Cliquez sur Appliquer. Les tracés obtenus sont placés au-dessus de l'image d'origine.
6. Déplacez le résultat sur le côté pour comparer, puis supprimez le bitmap d'origine.
7. Enregistrez avec Fichier > Enregistrer sous et choisissez un format SVG.

Balayages multiples donne plus de détail de couleur mais crée beaucoup d'objets qui se chevauchent et qu'il faut nettoyer. Commencez avec moins de couleurs et n'en ajoutez que si nécessaire.

Obtenir une vectorisation plus propre

L'essentiel de la qualité vient de l'image de départ. Quelques minutes de préparation font une grande différence.

• Partez de la version la plus grande et la plus nette que vous trouvez. Plus de pixels le long de chaque bord donne des courbes plus lisses.
• Rognez tout sauf le logo avec l'outil de recadrage, pour que les marques parasites ne deviennent pas des formes.
• Supprimez ou aplatissez l'arrière-plan. Un fond blanc uni ou transparent se vectorise bien mieux qu'un fond texturé.
• Réduisez les couleurs. Pour un logo d'une seule couleur, le passer d'abord en noir et blanc avec l'outil niveaux de gris et augmenter le contraste aide l'outil à trouver des contours propres.
• Évitez les sources minuscules. Un logo de 100 pixels de large contient trop peu d'informations sur les contours, et les courbes paraîtront bosselées à toutes les tailles.

Après la vectorisation, zoomez sur les angles et les petits textes. Les outils de vectorisation ont tendance à arrondir les angles vifs et à fusionner les lettres très proches. Si cela arrive, essayez une source plus grande ou corrigez ces zones à la main.

Quand redessiner plutôt que vectoriser

Si le logo compte, par exemple l'identité d'une entreprise destinée à des enseignes ou des t-shirts, une vectorisation n'est qu'un point de départ. Un graphiste peut le redessiner dans un éditeur vectoriel en s'appuyant sur la vectorisation, et produire des tracés propres et épurés aux couleurs exactes.

Avant tout cela, demandez le fichier vectoriel d'origine à la personne qui a créé le logo. Un fichier AI, EPS, PDF ou SVG fourni par le graphiste sera toujours meilleur qu'une vectorisation. Et si vous n'avez besoin que d'une image nette à une taille précise, un PNG haute résolution peut suffire sans aucune conversion.

Dans l'autre sens, c'est bien plus simple, car un SVG peut être rendu à n'importe quelle taille en pixels. Le guide pour ouvrir des fichiers SVG et les enregistrer en PNG ou JPG l'explique.

Questions fréquentes