Guide du favicon transparent
Un fond opaque sur un favicon paraît daté et jure avec le mode sombre. Voici comment préserver l'alpha de bout en bout.
Vérifiez les favicons de n'importe quel site
Installez l'extension Chrome FetchFavicon pour extraire, prévisualiser et valider les favicons instantanément.
Partir d'une source transparente
Exportez votre logo en PNG-32 sans fond, ou utilisez un SVG. Le flou provient le plus souvent d'un fond blanc intégré dans l'image, pas de l'outil favicon.
Le .ico supporte l'alpha
Les entrées compressées en PNG à l'intérieur du .ico conservent leur canal alpha. Les entrées bitmap, non — utilisez un outil qui choisit le bon encodage par taille.
Gérer le mode sombre
Publiez un SVG avec un bloc <style>@media (prefers-color-scheme: dark) { ... }</style> et laissez le .ico assurer le fallback statique.
FAQ
How do I make a favicon with a transparent background?
Start from a PNG-32 or SVG with no baked-in background. Export to .ico using a tool that preserves the alpha channel.
Does .ico support transparency?
Yes when entries use PNG compression. Bitmap-encoded .ico entries do not preserve alpha.
How do transparent favicons work in dark mode?
Ship an SVG favicon with prefers-color-scheme styles, and keep a static .ico fallback for browsers that ignore SVG.