Инструменты › Дизайн
Студия favicon и иконок приложения
Превратите один логотип в favicon.ico, apple-touch-icon, адаптивные и maskable-иконки для Android, набор AppIcon для iOS и site.webmanifest.
Что внутри
favicon.ico (16, 32, 48), PNG-фавиконки, apple-touch-icon, иконки Android Chrome и maskable, site.webmanifest, набор AppIcon для iOS в Xcode, mipmap для Android с адаптивной иконкой и этот фрагмент HTML:
<link rel="icon" href="/favicon.ico" sizes="48x48"> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> <link rel="apple-touch-icon" href="/apple-touch-icon.png"> <link rel="manifest" href="/site.webmanifest"> <meta name="theme-color" content="#F39A3D">
Как это работает
- Логотип рисуется на canvas в каждом размере, с безопасными зонами для maskable- и адаптивных иконок.
- favicon.ico содержит PNG размером 16, 32 и 48 px, которые читает любой современный браузер.
Вопросы
Какой исходник подходит лучше всего?
SVG или квадратный PNG от 512×512 с небольшими полями вокруг знака.