Создание значка приложения для Windows
После создания значка приложения необходимо создать файлы значков самостоятельно. Так как Windows поддерживает несколько тем, разрешения экрана и коэффициенты масштабирования, вы должны предоставить несколько версий значка, чтобы он выглядел отлично на каждом устройстве при любом размере.
Размеры значков (WPF, UWP, WinUI)
В Windows значок приложения будет отображаться в различных размерах в зависимости от того, где отображается значок и от параметров масштабирования экрана пользователя. В следующей таблице перечислены все возможные размеры, которые Windows может использовать для отображения значка.
Размеры значков (Win32)
Файлы WINDOWS ICO уже давно. Используются стандартные размеры, которые являются подмножеством полного набора выше.
Масштабирование значков
Когда Windows отображает значок приложения, сначала будет искать точное соответствие размеру. Если точного соответствия нет, он будет искать следующий размер выше и уменьшать масштаб. Добавление значков большего размера в приложение означает, что Windows будет чаще иметь идеальное соответствие пикселей и уменьшить масштаб, применяемый к масштабируемым значкам.
| коэффициент масштабирования Windows 11 | 100 % | 125% | 150% | 200 % | 250% | 300% | 400 % |
|---|---|---|---|---|---|---|---|
| Контекстное меню, строка заголовка, область задач | 16 пикселей | 20 пикселей | 24 пикселей | 32 пикселей | 40px | 48 пикселей | 64 пикселей |
| Панель задач, результаты поиска, список «Запуск всех приложений» | 24 пикселей | 30 пикселей | 36 пикселей | 48 пикселей | 60 пикселей | 72 пикселей | 96 пикселей |
| Начальные закрепления | 32 пикселей | 40px | 48 пикселей | 64 пикселей | 80 пикселей | 96 пикселей | 256 пикселей |
Приложения должны иметь как минимум 16×16, 24×24, 32×32, 48×48 и 256×256. Здесь рассматриваются самые распространенные размеры значков, и, предоставляя значок размером 256 пикселей, Windows всегда будет масштабировать значок только вниз, но никогда не увеличивать.
Прозрачный фон
Значки лучше всего выглядят с прозрачным фоном. Если фирменная символика вашего приложения требует, чтобы значок был наклеен на фоне, это тоже нормально. Однако вам придется повторно реализовать некоторые функции тем, которые прозрачные значки получают бесплатно. Например, можно указать версию значка приложения, размещенную на двух разных фонах: один лучше подходит для светлой темы, а другой — для темной темы.
Полный список значков и вариантов
Windows использует различные ресурсы значков в разных контекстах пользовательского интерфейса. Использование немного изменилось между Windows 10 & Windows 11.
В приведенных ниже списках определяются имена файлов, которые Windows ожидает содержать каждый соответствующий значок.
Значок приложения
В Windows 10 и 11 значок AppList является основным значком вашего приложения. Он будет использоваться в нескольких местах, включая панель задач, начальные закрепления, список всех приложений и список результатов поиска. Windows 11 выбирает соответствующий значок для списка всех приложений на основе текущего коэффициента масштабирования, но в Windows 10 используются конкретные явно определенные значки, если вы их предоставляете.
Требуются отдельные файлы для всех трех вариантов темы (по умолчанию, светлая тема, темная тема), даже если значок совпадает. Если вы не предоставите эти файлы, значок будет отображаться на системной пластине значка, чтобы обеспечить минимальный коэффициент контрастности.
Размер целевого объекта списка приложений (обязательно)
- AppList.targetsize-16.png
- AppList.targetsize-20.png
- AppList.targetsize-24.png
- AppList.targetsize-30.png
- AppList.targetsize-32.png
- AppList.targetsize-36.png
- AppList.targetsize-40.png
- AppList.targetsize-48.png
- AppList.targetsize-60.png
- AppList.targetsize-64.png
- AppList.targetsize-72.png
- AppList.targetsize-80.png
- AppList.targetsize-96.png
- AppList.targetsize-256.png
Темная тема (обязательно)
- AppList.targetsize-16_altform-unplated.png
- AppList.targetsize-20_altform-unplated.png
- AppList.targetsize-24_altform-unplated.png
- AppList.targetsize-30_altform-unplated.png
- AppList.targetsize-32_altform-unplated.png
- AppList.targetsize-36_altform-unplated.png
- AppList.targetsize-40_altform-unplated.png
- AppList.targetsize-48_altform-unplated.png
- AppList.targetsize-60_altform-unplated.png
- AppList.targetsize-64_altform-unplated.png
- AppList.targetsize-72_altform-unplated.png
- AppList.targetsize-80_altform-unplated.png
- AppList.targetsize-96_altform-unplated.png
- AppList.targetsize-256_altform-unplated.png
Светлая тема (обязательно)
- AppList.targetsize-16_altform-lightunplated.png
- AppList.targetsize-20_altform-lightunplated.png
- AppList.targetsize-24_altform-lightunplated.png
- AppList.targetsize-30_altform-lightunplated.png
- AppList.targetsize-32_altform-lightunplated.png
- AppList.targetsize-36_altform-lightunplated.png
- AppList.targetsize-40_altform-lightunplated.png
- AppList.targetsize-48_altform-lightunplated.png
- AppList.targetsize-60_altform-lightunplated.png
- AppList.targetsize-64_altform-lightunplated.png
- AppList.targetsize-72_altform-lightunplated.png
- AppList.targetsize-80_altform-lightunplated.png
- AppList.targetsize-96_altform-lightunplated.png
- AppList.targetsize-256_altform-lightunplated.png
Масштаб списка приложений (Windows 10) (необязательно)
- AppList.scale-100.png
- AppList.scale-125.png
- AppList.scale-150.png
- AppList.scale-200.png
- AppList.scale-400.png
Светлая тема (Windows 10) (необязательно)
- AppList.scale-100_altform-colorful_theme-light.png
- AppList.scale-125_altform-colorful_theme-light.png
- AppList.scale-150_altform-colorful_theme-light.png
- AppList.scale-200_altform-colorful_theme-light.png
- AppList.scale-400_altform-colorful_theme-light.png
Если вы не включите ресурсы targetsize-*-altform-unplated над вашим значком, он будет масштабироваться до меньшего размера и получить нежелательную обратную панель за значком на панели задач и начальном экране.
Tiles
Windows 10 поддерживает четыре размера плиток: маленький, средний, широкий и большой.
Темная тема по умолчанию (частично требуется)
- SmallTile.scale-100.png
- SmallTile.scale-125.png
- SmallTile.scale-150.png
- SmallTile.scale-200.png
- SmallTile.scale-400.png
- MedTile.scale-100.png
- MedTile.scale-125.png
- MedTile.scale-150.png
- MedTile.scale-200.png
- MedTile.scale-400.png
- WideTile.scale-100.png
- WideTile.scale-125.png
- WideTile.scale-150.png
- WideTile.scale-200.png
- WideTile.scale-400.png
- LargeTile.scale-100.png
- LargeTile.scale-125.png
- LargeTile.scale-150.png
- LargeTile.scale-200.png
- LargeTile.scale-400.png
Светлая тема (необязательно)
- SmallTile.scale-100_altform-colorful_theme-light.png
- SmallTile.scale-125_altform-colorful_theme-light.png
- SmallTile.scale-150_altform-colorful_theme-light.png
- SmallTile.scale-200_altform-colorful_theme-light.png
- SmallTile.scale-400_altform-colorful_theme-light.png
- MedTile.scale-100_altform-colorful_theme-light.png
- MedTile.scale-125_altform-colorful_theme-light.png
- MedTile.scale-150_altform-colorful_theme-light.png
- MedTile.scale-200_altform-colorful_theme-light.png
- MedTile.scale-400_altform-colorful_theme-light.png
- WideTile.scale-100_altform-colorful_theme-light.png
- WideTile.scale-125_altform-colorful_theme-light.png
- WideTile.scale-150_altform-colorful_theme-light.png
- WideTile.scale-200_altform-colorful_theme-light.png
- WideTile.scale-400_altform-colorful_theme-light.png
- LargeTile.scale-100_altform-colorful_theme-light.png
- LargeTile.scale-125_altform-colorful_theme-light.png
- LargeTile.scale-150_altform-colorful_theme-light.png
- LargeTile.scale-200_altform-colorful_theme-light.png 8 LargeTile.scale-400_altform-colorful_theme-light.png
Windows 11 не использует ресурсы плиток, но в настоящее время для публикации в Microsoft Store требуется по крайней мере средний уровень ресурсов плитки на 100 %. Если ваше приложение совместимо с Windows 10 & 11, рекомендуется включить как можно больше ресурсов плитки.
Экран-заставка
Экраны-заставки также могут иметь светлую и темную темы, например ресурсы значка приложения.
Default
- SplashScreen.scale-100.png
- SplashScreen.scale-125.png
- SplashScreen.scale-150.png
- SplashScreen.scale-200.png
- SplashScreen.scale-400.png
Темная тема (необязательно)
- SplashScreen.scale-100_altform-colorful_theme-dark.png
- SplashScreen.scale-125_altform-colorful_theme-dark.png
- SplashScreen.scale-150_altform-colorful_theme-dark.png
- SplashScreen.scale-200_altform-colorful_theme-dark.png
- SplashScreen.scale-400_altform-colorful_theme-dark.png
Светлая тема (необязательно)
- SplashScreen.scale-100_altform-colorful_theme-light.png
- SplashScreen.scale-125_altform-colorful_theme-light.png
- SplashScreen.scale-150_altform-colorful_theme-light.png
- SplashScreen.scale-200_altform-colorful_theme-light.png
- SplashScreen.scale-400_altform-colorful_theme-light.png
Эмблема
Значки индикаторов событий используются на экране блокировки Windows 10 и для большинства приложений не требуются.
Windows 10 (необязательно)
- BadgeLogo.scale-100.png
- BadgeLogo.scale-125.png
- BadgeLogo.scale-150.png
- BadgeLogo.scale-200.png
- BadgeLogo.scale-400.png
Логотип пакета (логотип Microsoft Store)
Эти ресурсы необходимы для публикации в Microsoft Store.
Темная тема по умолчанию (обязательно)
- StoreLogo.scale-100.png
- StoreLogo.scale-125.png
- StoreLogo.scale-150.png
- StoreLogo.scale-200.png
- StoreLogo.scale-400.png
Светлая тема (необязательно)
- StoreLogo.scale-100_altform-colorful_theme-light.png
- StoreLogo.scale-125_altform-colorful_theme-light.png
- StoreLogo.scale-150_altform-colorful_theme-light.png
- StoreLogo.scale-200_altform-colorful_theme-light.png
- StoreLogo.scale-400_altform-colorful_theme-light.png
Как устанавливать png иконки
Задумавшись о смене стандартных значков приложений, вы непременно обратите внимание на то, что большая часть иконок, которые можно найти в интернете, выполнена в формате, который не поддерживает Windows для этих целей, а именно в PNG. Решение этой проблемы имеется и оно довольно простое.
Статьи по теме:
- Как устанавливать png иконки
- Как добавить иконки
- Как поменять иконку сайта
Инструкция
Поскольку стандартные средства Windows предусматривают возможность установки в качестве иконок изображения в формате ICO, будет вполне логично преобразовать PNG-иконку в подходящий системе формат. Для этого воспользуйтесь одним из бесплатных онлайн-конвертеров, предназначенных специально для этой цели: www.convertico.com или www.converticon.com.
Несмотря на отсутствие русского языка в интерфейсе, пользователю, не знакомому с английским, будет не трудно осуществить конвертацию. Понадобится всего лишь указать доступ к PNG-файлу на компьютере, нажать кнопку Convert (или Export) и сохранить полученную ICO-иконку на жестком диске.
Следующим действием будет выполнение установки. Для этого щелкните правой кнопкой мыши на ярлык программы или папки и выберите команду «Свойства» в контекстном меню. На вкладке «Ярлык» (для ярлыков) или «Настройка» (для папок) нажмите на кнопку «Сменить значок» и укажите путь к файлу, который вы до этого преобразовали в ICO. Нажмите кнопку «ОК» для завершения, после чего изменения вступят в силу.
Видео по теме
- как создать иконки png
Совет полезен?
Статьи по теме:
- Как применить иконки
- Как поставить новые иконки
- Как поставить .png иконку
Добавить комментарий к статье
Похожие советы
- Как установить иконки на файлы
- Как добавить на сайт иконку
- Как сменить иконки
- Как устанавливать новые иконки
- Как изменить значок сайта
- Как установить иконки для папок
- Как в Windows 7 установить иконки
- Как установить иконки на сайтах
- Как в папке поставить картинку
- Как поменять favicon
- Как изменить иконку программы
- Куда устанавливать иконки
- Как изменить иконку файла
- Как поменять значки для папок
- Как установить иконки в компьютере
- Как поместить иконку
- Как установить значки для папок
- Как сменить иконки на папки
- Как заменить иконку на рабочем столе
- Как заменить иконки
- Как изменить иконки
- Как менять иконки Windows 7
- Как сменить значок программы
- Как изменить значок файла
Новые советы от КакПросто
Рекомендованная статья
Как происходит заражение компьютера вирусом
Наиболее слабое звено в цепи компьютерной безопасности — это сам пользователь. Наличие установленного на компьютере.
Как изменить иконку (favicon) для сайта?
Favicon (англ. favorite icon — избранный значок) — это небольшое изображение, которое ассоциируется с определенным вебсайтом. Вы, наверняка, замечали, что у каждого сайта есть такая иконка:
Вот где можно увидеть такую иконку:
- Закладки и вкладки браузера
- Результаты поиска Яндекс, Google
- Каталоги и рейтинги, которые загружают favicon сайтов
- Панель задач и рабочий стол операционной системы
Иконка сайта позволяет пользователям быстрее находить сайт во вкладках браузера или результатах поиска. Favicon повышает узнаваемость сайта.
Где взять иконку для сайта?
По умолчанию все сайты uCoz имеют стандартный favicon. Чтобы получить свою иконку сайта, вы можете сделать следующее:
- Найти в интернете готовый файл иконки с расширением .ico (например, здесь)
- Перевести изображение в иконку с помощью онлайн сервисов конвертации или специальных программ
- Самостоятельно нарисовать иконку в графическом редакторе (например, в GIMP)
При создании файла favicon.ico важно знать, что иконка должна быть квадратной. Рекомендованные размеры 16х16, 32х32 и 48х48 пикселей.
Наряду с расширением .ico, в настоящее время используются иконки формата .png. Разрешение таких изображений может достигать 180×180 пикселей.
Как установить иконку на сайт?
Когда у вас будут готовы файлы иконок с расширением ico и png, с помощью файлового менеджера загрузите их в корень сайта (корень — это то, что вы видите первым при входе в файловый менеджер не переходя в другие директории):
Стандартная иконка favicon.ico будет заменена на новую и через некоторое время вы сможете увидеть ее во вкладках браузера, в закладках и в результатах поисковых систем.
Важно! Чтобы иконка отобразилась сразу, достаточно открыть ее по прямой ссылке http:// ваш-сайт.ру /favicon.ico и несколько раз выполнить комбинацию клавиш CTRL+F5. В результате вы в кеше обновите иконку на новую, далее при открытии главной страницы сайта просто обновите ее несколько раз и иконка в вкладке должна обновиться на новую.
Как объявить Apple Touch icon и плитку для Windows 10?
Apple Touch icon используется на многих платформах за пределами iOS. Поэтому важно предусмотреть несколько размеров иконок, чтобы каждая платформа смогла выбрать подходящую:
В Windows 10 есть плитки, иконки к которым могут быть объявлены следующим образом:
Иконки ICO и PNG
Иконки в форматах PNG и ICO предназначены для выборной замены значков операционной системы Windows 7 и 8, а также в других ОС. Кроме того, такие иконки можно применять в оформлении программ боковых панелей (например RocketDock и ObjectDock), или даже на основе их создавать скины для Rainmeter. Все цели использования представленных ниже для бесплатного скачивания иконок, зависят только от вас.
Для конвертирования иконки из формата «PNG» в «ICO» или наоборот предлагаем скачать программу «AveIcon» с помощью которой вы сможете быстро и удобно не только конвертировать иконки, а также изменять их размер.