favicon.svg: современная фавиконка
SVG-фавиконка масштабируется без потери качества и отлично выглядит на Retina. Это лучший базовый формат для большинства современных браузеров.
Плюсы SVG
- резкая картинка на любых размерах
- малый вес при простых формах
- можно аккуратно адаптировать под светлую/тёмную тему
Но нужен и fallback
Для максимальной совместимости добавьте favicon.ico и PNG-набор. Тогда сайт будет корректно отображаться в большем количестве устройств и сценариев.
Про тёмную тему
Если иконка тёмная — сделайте отдельный SVG для dark mode и подключите через prefers-color-scheme.
Сделать favicon.svg и набор fallback
Один SVG → полный ZIP с SVG/ICO/PNG.
FAQ
Почему favicon.svg иногда не показывается?
Либо браузер не поддерживает SVG-favicon в вашем режиме, либо есть кэш/ошибка пути. Поэтому и нужен fallback (ICO/PNG).
Можно ли использовать сложные SVG (фильтры, маски)?
Лучше избегать сложных эффектов. Чем проще SVG, тем стабильнее отображение и меньше риск проблем.