Quelle taille donner au logo de votre site : hauteur de l'en-tête en pixels CSS, fichiers retina 2x, SVG ou PNG, ainsi que les tailles du favicon, de l'Apple touch icon, de l'image de partage et du logo pour Google.
Il n'existe pas de taille de logo obligatoire. La plupart des en-têtes de sites affichent le logo à environ 32 à 60 pixels CSS de haut sur ordinateur et un peu moins sur téléphone, la largeur suivant la forme du logo. Utilisez un SVG si possible ; sinon, exportez un PNG au double de la taille d'affichage pour qu'il reste net sur les écrans haute densité.
Tailles de logo et d'icônes en bref (en octobre 2026)
Les questions de taille de logo naissent généralement d'un logo flou ou minuscule une fois le site en ligne. La solution consiste à raisonner avec deux nombres : la taille d'affichage, mesurée en pixels CSS, et la taille du fichier, qui doit être plus grande. Importez votre propre logo ci-dessous pour voir les deux, dans un en-tête sur ordinateur et sur téléphone, sans que rien ne quitte votre ordinateur.
Aucune norme ne la fixe. À titre indicatif, la plupart des en-têtes affichent le logo à environ 32 à 60 pixels CSS de haut sur ordinateur et autour de 28 à 44 sur téléphone. Un long logotype peut être moins haut qu'un symbole carré compact. Utilisez l'aperçu ci-dessus pour juger le vôtre.
Le SVG est un format vectoriel : il reste net à toutes les tailles et son fichier est souvent minuscule. Utilisez le PNG si le logo contient des détails photographiques ou si votre plateforme n'accepte pas le SVG, et exportez-le au double de la taille d'affichage.
Les écrans haute densité utilisent plus d'un pixel physique par pixel CSS. Un logo affiché à 40 px de haut est net sur un écran 2x si le fichier fait au moins 80 px de haut. Avec l'attribut srcset de img, vous pouvez proposer un fichier 1x et un fichier 2x et laisser le navigateur choisir.
Google indique qu'un favicon doit être carré et mesurer au moins 8x8 px, et recommande plus de 48x48 px. Notre guide des tailles de favicon liste les fichiers courants et le HTML pour les lier.
Les consignes photo de Google pour Business Profile indiquent JPG ou PNG, de 10 KB à 5 MB, 720 x 720 px recommandé et 250 x 250 px minimum. La page d'aide ne donne pas de dimensions spécifiques pour le logo : un logo carré de 720 x 720 px est donc un choix sûr.
La hauteur vient du CSS ; la largeur suit la forme du logo. Les attributs width et height réservent l'espace pendant le chargement.
logo.png fait 44 px de haut, [email protected] fait 88 px de haut. Le navigateur choisit le fichier 2x sur les écrans haute densité.
Un favicon, une Apple touch icon et une image de partage, chacun créé à partir de la version carrée de votre logo.
Votre fichier de logo
Un logo d'exemple s'affiche tant que vous n'avez pas choisi de fichier.
Hauteur du logo dans l'en-tête : {v} px
En-tête sur ordinateur
Menu
Rapport
Taille du fichier : {w} x {h} px.
Le SVG se redimensionne sans flou à n'importe quelle hauteur.
Pour un rendu net sur les écrans 2x à cette hauteur, le fichier doit faire au moins {v} px de haut.
Votre fichier est assez grand pour cette hauteur sur les écrans 2x.
Votre fichier est plus petit que cela, il risque donc de paraître flou sur les écrans haute densité.
CSS pour cette hauteur
Votre fichier est lu uniquement par votre navigateur et n'est jamais envoyé.
Logo d'exemple
Votre logo
Commencer gratuitement · Sans carte bancaire