Фавикон (.ico) против SVG
SVG — это самый интересный формат значков современной эпохи — векторный, с поддержкой темного режима и крошечный. Но он не сможет полностью заменить .ico в 2026 году. Вот почему и как использовать оба.
SVG бесконечно масштабируется и поддерживает медиа-запросы в темном режиме внутри самого файла. SVG размером 1 КБ охватывает любую плотность в каждом современном браузере.
ICO — универсальный запасной вариант. Старые версии Safari, устаревшие браузеры и соглашение об отсутствии URL-адресов <code>/favicon.ico</code> по-прежнему зависят от него.
Рекомендуемая настройка: отправьте <code>favicon.ico</code> + <code>favicon.svg</code>. Браузеры, поддерживающие SVG, предпочтут его; остальные автоматически возвращаются к .ico.
Как это работает
- 1
Создайте или экспортируйте SVG
Квадратный viewBox, однокорневой элемент <svg>.
- 2
Создайте резервный вариант .ico
Используйте FetchFavicon, чтобы растрировать SVG в файл .ico разных размеров.
- 3
Свяжите оба
<link rel="icon" href="/favicon.ico"> + <link rel="icon" type="image/svg+xml" href="/favicon.svg">.
Попробовать сейчас
Создайте пару .ico + SVG.
Конвертер SVG в PNGЧастые вопросы
Могу ли я полностью удалить .ico, если использую SVG?+
Не безопасно. Многие средства внедрения социальных сетей, программы чтения RSS и устаревшие инструменты по-прежнему по соглашению запрашивают /favicon.ico.
Какие браузеры поддерживают значки SVG?+
Chrome 80+, Edge 80+, Firefox 41+, Safari 15+ и Храбрый. iOS Safari по-прежнему предпочитает apple-touch-icon PNG.
Насколько маленьким может быть значок SVG?+
Менее 1 КБ для чистой монохромной отметки. Даже сложные многоцветные логотипы редко превышают размер 4 КБ.