Генератор иконок для приложения
Выберите большую квадратную картинку и получите её во всех обычных размерах иконок: набор iOS с именами в стиле Xcode и иконкой 1024 px для App Store, иконки лаунчера Android для каждой плотности экрана плюс иконку 512 px для Google Play или иконки манифеста веб-приложения и Apple touch icon. Скачивайте PNG по одному или все сразу.
Работает в браузере: всё, что вы вводите, никуда не отправляется.
Как пользоваться
- Выберите или перетащите исходник иконки — лучше квадратный PNG размером от 1024 × 1024 пикселей.
- Выберите платформу: iOS, Android или веб-приложение.
- Укажите, что делать с неквадратной картинкой, и добавьте отступ, если рисунок касается краёв.
- Выберите цвет фона; для иконок Android и веба вместо него можно сохранить прозрачность.
- Скачайте иконки по одной или нажмите Скачать все, чтобы сохранить все PNG платформы один за другим.
Как работает
Каждая иконка рисуется на холсте точно своего размера в пикселях с качественным сглаживанием и сохраняется в PNG. С отступом p рисунок вписывается во внутренний квадрат со стороной сторона × (1 − 2p). Режим «Обрезать и заполнить» берёт квадрат из центра: картинка 800 × 600 обрезается до 600 × 600, начиная со 100 пикселей от левого края. «Вписать целиком» подгоняет длинную сторону под внутренний квадрат: та же картинка в иконке 100 px станет 100 × 75 и встанет в 12,5 px от верха.
Имена iOS строятся по размеру в пунктах и масштабу (Icon-60@3x.png — это 60 pt × 3 = 180 px). В именах файлов Android указана плотность (ic_launcher-xxhdpi.png); переименуйте их в ic_launcher.png внутри каждой папки mipmap.
Пример
Логотип 2048 × 2048 с отступом 10 % для Android: в иконке xxxhdpi 192 px логотип занимает квадрат 153,6 px в 19,2 px от каждого края; в иконке mdpi 48 px — квадрат 38,4 px. В иконке 512 px для Google Play логотип занимает квадрат 409,6 px.
Советы
- Рисуйте исходник в 1024 px и проверяйте его и в 40 px: тонкие линии и мелкий текст на маленьких размерах пропадают.
- Держите важные детали подальше от углов: лаунчеры с круглыми иконками их срезают.
- Для веб-набора выключите прозрачность, если у рисунка прозрачный фон: iPhone и iPad показывают прозрачные места Apple touch icon чёрными.
- Для favicon.ico сайта и HTML-тегов воспользуйтесь генератором фавиконов.
Частые вопросы
Какие размеры я получу для iOS?
1024 × 1024 для App Store и классический набор asset catalog: 180 и 120 px для главного экрана iPhone (60 pt при 3× и 2×), 167 px для iPad Pro, 152 и 76 px для iPad, 120 и 80 px для Spotlight, 87 и 58 px для настроек, 60 и 40 px для уведомлений. Свежие версии Xcode умеют собирать приложение и из одной иконки 1024 px.
Какие размеры я получу для Android?
Иконка лаунчера — 48 dp, то есть 48 px при mdpi, 72 px при hdpi, 96 px при xhdpi, 144 px при xxhdpi и 192 px при xxxhdpi, плюс иконка 512 × 512 px для страницы в Google Play. Положите каждый файл лаунчера в свою папку mipmap под именем ic_launcher.png. Адаптивные иконки с отдельными слоями переднего плана и фона здесь не создаются.
Почему иконки iOS никогда не бывают прозрачными?
App Store не принимает иконку приложения с прозрачностью, поэтому набор iOS всегда рисуется на выбранном вами цвете фона. Для иконок Android и веба прозрачность можно сохранить.
Нужно ли скруглять углы?
Нет. iOS и большинство лаунчеров Android сами обрезают иконку по своей форме, так что давайте полный квадрат. Если углы на картинке уже скруглены, за ними будет виден цвет фона.
Что делают режимы «Обрезать и заполнить» и «Вписать целиком»?
«Обрезать и заполнить» берёт самый большой квадрат из центра неквадратной картинки и заполняет им иконку. «Вписать целиком» сохраняет всю картинку, а остальное заливает цветом фона (или оставляет прозрачным). Отступ добавляет поля со всех сторон — это помогает, когда лаунчер обрезает иконки в круг.
Загружается ли моя картинка на сервер?
Нет. Каждую иконку рисует и сохраняет ваш браузер на вашем устройстве.
