Comment extraire un logo SVG d'un site

À regarder — 19 secondes

La marque, en pleine fidélité

tutoriel · logos

L'étape du nommage compte plus pour les logos que pour tout le reste — un dossier de marque plein de fichiers numérotés est un dossier que personne n'utilise.

Ce que montre l'enregistrement

1. Le logo de l'en-tête est un <svg> en ligne
2. Analysez la page et il revient avec les autres
3. Feuilletez jusqu'à la marque elle-même
4. Nommez-le correctement pour votre dossier de marque
5. Enregistré en pleine fidélité — il monte jusqu'au panneau publicitaire
6. Vérifiez la licence avant de réutiliser la marque de quelqu'un

Avant le comment

Un logo est la marque déposée de quelqu'un, et l'extraire n'est pas une permission

Cela vaut deux minutes, car se tromper coûte cher. Pouvoir enregistrer une marque et avoir le droit de l'utiliser sont deux questions distinctes, et la seconde n'a rien à voir avec cet outil.

En gros, et ceci n'est pas un conseil juridique : utiliser le logo d'une entreprise pour désigner cette entreprise — une liste de clients, une rangée « compatible avec », un article de presse, un tableau comparatif — est généralement acceptable, et la plupart des sociétés publient des chartes qui le disent. L'utiliser d'une façon qui laisse entendre une caution, un partenariat ou une paternité ne l'est pas, pas plus que modifier une marque et la faire passer pour la vôtre.

Le geste pratique : avant de l'utiliser, cherchez la page marque ou presse de l'entreprise. La plupart des grandes organisations publient un kit officiel avec le logo en plusieurs formats, des règles de zone de protection, des déclinaisons de couleurs approuvées et une courte licence. Ce kit est à la fois plus sûr et généralement mieux préparé que tout ce que vous extrairez — l'extraction, c'est pour quand il n'y a pas de kit, ou quand il vous faut la marque tout de suite pour une maquette.

Extraire la marque

Les logos sont en général le vecteur le plus facile à trouver sur une page, pour une raison structurelle.

1. Allez sur la page d'accueil. Le logo d'en-tête est presque toujours un <svg> en ligne — les sites font ainsi pour que la marque reste nette sur tous les écrans et puisse être recolorée en mode sombre.
2. Ouvrez le popup et analysez. Le logo figure généralement parmi les premiers vecteurs trouvés, car il se situe en haut du document.
3. Feuilletez jusqu'à lui et confirmez dans l'aperçu. L'aperçu isolé compte ici : il vous montre si vous avez le bloc complet, le logotype seul ou seulement le symbole. Les pages contiennent souvent les trois.
4. Nommez-le et téléchargez. Prenez un nom que vous reconnaîtrez plus tard — acme-logo-complet, acme-symbole. Puis Télécharger le courant.

Où se cachent les variantes

Un site porte souvent plus d'une version de sa propre marque, et celle de l'en-tête n'est pas forcément celle que vous voulez. Regardez le pied de page, qui a souvent une variante monochrome ou inversée. Regardez la mise en page mobile en fenêtre étroite, qui remplace fréquemment le bloc complet par le symbole seul. Et testez tout basculement en mode sombre, qui peut substituer une version claire sur fond sombre. Chacune est un vecteur distinct et chacune apparaîtra dans l'analyse.

Pourquoi le logo est ressorti noir

Si la marque utilise currentColor pour s'adapter au mode sombre, le fichier extrait n'a pas de couleur propre et s'affiche en noir. C'est le balisage source véritable. Recolorez-le dans Figma ou Illustrator, ou passez par le SVG Color Changer. Pour une marque en particulier, prenez la valeur officielle dans la charte plutôt qu'à la pipette sur une capture — les écrans mentent sur la couleur.

Si le logo est un PNG

Certains sites livrent encore un logo raster, et aucun outil ne peut le retransformer en vecteur — les données de courbe ont disparu. Vos options : le kit de marque de l'entreprise, qui contiendra généralement le vecteur, ou le vectoriser, ce qui donne une approximation aux courbes légèrement fausses qu'un designer remarquera. Demandez le kit.

En général

Le logo d'en-tête est un <svg> en ligne, il est donc parmi les premiers trouvés.

Variantes

Regardez le pied de page, la mise en page mobile et le mode sombre — souvent trois fichiers différents.

Juridiquement

L'extraction n'est pas une permission. Cherchez d'abord le kit de marque de l'entreprise.

Si c'est un PNG

Il ne peut pas être reconverti en vecteur. Demandez le fichier officiel.

Bon à savoir

Questions fréquentes