Icônes SVG vs ICO

SVG est l'avenir ; ICO est le socle. Publiez les deux.

4 min de lecture

Vérifiez les favicons de n'importe quel site

Installez l'extension Chrome FetchFavicon pour extraire, prévisualiser et valider les favicons instantanément.

Installer l'extension Chrome

Pourquoi le SVG l'emporte sur les navigateurs modernes

Un seul fichier, redimensionnable à l'infini, compatible avec les media queries mode sombre. Le poids se situe généralement sous les 2 Ko.

Pourquoi le ICO reste incontournable

Les navigateurs anciens, les raccourcis Windows et certains agrégateurs ne lisent que le .ico. L'omettre produit une icône cassée pour environ 5 % des utilisateurs.

Utiliser les deux ensemble

Déclarez favicon.ico d'abord comme fallback universel, puis ajoutez <link rel="icon" type="image/svg+xml"> pour les navigateurs qui le supportent.

FAQ

Should I use SVG or ICO for a favicon?

Use both. Link favicon.ico as the universal fallback, then add <link rel="icon" type="image/svg+xml"> for scalable rendering on modern browsers.

Does SVG work in every browser?

Most modern browsers support SVG favicons, but older browsers and some embedders still need .ico. Never ship SVG alone.

Can an SVG favicon support dark mode?

Yes. Embed a <style>@media (prefers-color-scheme: dark) { ... }</style> block inside the SVG file.

Guides associés

Essayez les outils

Continuer la lecture