Comparatif — SVG contre capture
SVG Downloader face à la capture d'icônes
Quand une icône vous plaît, le réflexe est d'en faire une capture. C'est le mauvais outil dès l'instant où il vous faut le vrai fichier. Voici l'arbitrage honnête entre une capture, une copie depuis DevTools et l'extraction du SVG réel.
L'arbitrage
La photo d'une icône n'est pas l'icône
Une capture est une image matricielle : une grille fixe de pixels prise à une seule taille. C'est réellement utile quand vous ne voulez qu'une référence visuelle rapide, quelque chose à glisser dans un document ou un message pour dire « celle-là, ici ». Rien à installer, rien à réfléchir, c'est fait.
Tout s'effondre dès qu'il faut utiliser l'icône. Agrandissez-la et elle devient floue, car il n'y a pas de pixels au-delà de ceux capturés. Essayez de la recolorer et vous peignez sur une photo. Mettez-la dans un build et vous livrez un PNG lourd là où un vecteur de 400 octets suffisait. La capture répondait à « à quoi ça ressemble » ; jamais à « donne-moi le fichier ».
Copier depuis DevTools est l'entre-deux honnête — on obtient le vrai balisage — mais c'est fastidieux. Vous cherchez le bon nœud <svg>, copiez son HTML externe, le collez dans un fichier, et découvrez qu'il ne s'ouvre pas faute d'espace de noms. Et cela ne fait rien pour les fonds CSS, les références <use> d'un sprite, ni pour les vingt autres icônes de la page.
| Capture / PNG | Copie depuis DevTools | SVG Downloader | |
|---|---|---|---|
| Format de sortie | PNG matriciel | Balisage SVG (à la main) | Vrai fichier .svg |
| Reste net au redimensionnement | Non — ça floute | Oui | Oui |
| Modifiable / recolorable | Non | Oui | Oui |
| Taille du fichier | Lourd | Minuscule | Minuscule |
| Marche sur le SVG en ligne | Seulement comme image | Oui | Oui |
| Marche sur les fonds CSS | Seulement comme image | Non | Oui |
| Marche sur les sprites (<use>) | Seulement comme image | Rarement | Oui — même document |
| En lot / page entière | Non | Non | Oui — en ZIP |
| Effort | Faible | Élevé, fastidieux | Deux clics |
Quand chacun a raison
- Capture — vous voulez une référence visuelle à montrer, pas le fichier. C'est parfaitement valable, et plus rapide que tout le reste pour ça.
- Copie depuis DevTools — il vous faut exactement une icône en ligne, vous êtes déjà dans l'inspecteur et réparer l'espace de noms vous-même ne vous dérange pas.
- SVG Downloader — vous voulez le vrai vecteur : net, modifiable, minuscule. Il lit le SVG en ligne, les fonds CSS et les références de sprite, répare le
xmlnsmanquant, nomme le fichier intelligemment et peut empaqueter toute la page dans un ZIP. Le tout sur votre appareil — rien n'est envoyé.
Si vous avez décidé de vouloir le fichier plutôt qu'une photo de celui-ci, le guide « télécharger depuis n'importe quel site » déroule toute la marche à suivre.
Bon à savoir
Capture ou SVG ?
Une capture d'icône suffit-elle parfois ?
Oui — pour une référence visuelle rapide. S'il s'agit juste de coller l'image d'une icône dans un document ou un chat pour la désigner, une capture convient. Elle ne convient plus dès qu'il faut redimensionner, recolorer ou livrer l'icône, car une capture est une image matricielle de taille fixe, pas le fichier.
Pourquoi un SVG vaut-il mieux qu'un PNG pour une icône ?
Un SVG est du texte vectoriel : il reste parfaitement net à toutes les tailles, il pèse généralement une fraction d'une image matricielle, et vous pouvez recolorer ou modifier ses tracés. Un PNG issu d'une capture est figé aux pixels capturés et devient flou dès qu'on l'agrandit.
Prenez l'icône, pas sa photo
Gratuit, privé, et il enregistre le vrai vecteur en deux clics.