Как преобразовать квадратный SVG в полноразмерный ICO?

Решение командной строки:

1. Экспортируйте SVG master.svgв PNG с помощью Inkscape:

# Install on Ubuntu
sudo apt-get install inkscape
# Other systems: make sure Inkscape is in your PATH

inkscape -w 16 -h 16 -e 16.png master.svg
inkscape -w 32 -h 32 -e 32.png master.svg
inkscape -w 48 -h 48 -e 48.png master.svg

2. Преобразуйте изображения PNG в ICO с помощью ImageMagick:

# Install on Ubuntu
sudo apt-get install imagemagick

convert 16.png 32.png 48.png icon.ico

3. Необязательно — убедитесь, что ваш ICO содержит все:

$ identify icon.ico
icon.ico[1] ICO 16x16 16x16+0+0 32-bit sRGB 21.2KB 0.000u 0:00.000
icon.ico[0] ICO 32x32 32x32+0+0 32-bit sRGB 21.2KB 0.000u 0:00.000
icon.ico[0] ICO 48x48 48x48+0+0 32-bit sRGB 21.2KB 0.000u 0:00.000

Вы можете использовать ImageMagick прямо сейчас:

convert -density 384 icon.svg -define icon:auto-resize icon.ico

[Редактировать]

Начиная с ImageMagick версии 7, вам нужно добавить magickперед командой (см. документацию по CLI ), поэтому командная строка теперь:

magick -density 384 icon.svg -define icon:auto-resize icon.ico

Вы также можете проверить этот ответ для получения дополнительной информации: https://stackoverflow.com/a/16922387/1603480

Баш версия...

#!/bin/bash

set -ex

svg=$1

size=(16 32 24 48 72 96 144 152 192 196)

out="$(mkdir -d)"

echo Making bitmaps from your svg...

for i in ${size[@]}; do
  inkscape $svg --export-png="$out/$i.png" -w$i -h$i --without-gui
done

echo Compressing...

## Replace with your favorite (e.g. pngquant)
# optipng -o7 "$out/*.png"
pngquant -f --ext .png "$out/*.png" --posterize 4 --speed 1

echo Converting to favicon.ico...

convert "$out/*.png" favicon.ico

# Clean-up
rm -rf "$out/"

echo Done

Применение:./favicon.sh your-square-svg-file.svg

Требуется: inkscape imagemagick optipng (необязательно) от вашего менеджера пакетов.

Мне было проще воссоздать это для оболочки bash, поскольку Win10 и Inkscape не ладили. Это было протестировано в подсистеме Windows для Linux, но оно также должно работать на Mac.

Воспользовался этой ссылкой, чтобы выбрать нужные мне размеры: https://github.com/audreyr/favicon-cheat-sheet . Настройте sizeмассив в соответствии с вашими потребностями.

Я бы предложил такой подход:

1) создайте скрипт для экспорта SVG любого необходимого размера. Я написал этот скрипт .bat, чтобы помочь мне создать значок Android

@echo off
set file="%~f1"
set path=%~dp1
set inkscape="C:\Program Files\Inkscape\inkscape.exe"

echo Le icone saranno salvate in %path%
echo Produzione icone applicative

echo %file% --export-png="%path%/ic32.png" -w32 -h32 > %~dp1/commands.txt
echo %file% --export-png="%path%/ic48.png" -w48 -h48 > %~dp1/commands.txt
echo %file% --export-png="%path%/ic72.png" -w72 -h72 > %~dp1/commands.txt
echo %file% --export-png="%path%/ic96.png" -w96 -h96 > %~dp1/commands.txt
echo %file% --export-png="%path%/ic144.png" -w144 -h144 > %~dp1/commands.txt
echo %file% --export-png="%path%/ic192.png" -w192 -h192 > %~dp1/commands.txt
echo %file% --export-png="%path%/ic512.png" -w512 -h512 > %~dp1/commands.txt
%inkscape% --shell < %~dp1/commands.txt
erase "%~dp1/commands.txt"

echo Procedura terminata

ПРИМЕЧАНИЕ :

• определенная переменная %inkscape% должна соответствовать вашему пути установки Inkscape.
• сценарий повторяет все команды экспорта во временный файл для лучшего управления процессом inkscape. Параметр cli «shell» принимает больше команд, используя один экземпляр вместо создания экземпляра для каждой команды.

С этим параметром Inkscape перейдет в интерактивный режим оболочки командной строки. В этом режиме вы вводите команды в командной строке, а Inkscape выполняет их, и вам не нужно запускать новую копию Inkscape для каждой команды. Эта функция в основном полезна для сценариев и использования сервера: она не добавляет новых возможностей, но позволяет улучшить требования к скорости и памяти для любого сценария, который повторно вызывает Inkscape для выполнения задач командной строки (таких как экспорт или преобразование). Каждая команда в режиме оболочки должна быть полной допустимой командной строкой Inkscape, но без имени программы Inkscape, например, «file.svg --export-pdf=file.pdf». ( см. руководство по inkscape )

2) Добавьте к приведенному выше сценарию синтаксис преобразования, указанный в ответе philippe-b , который объединяет все сгенерированные PNG в один файл ICO.

3) При желании удалите все экспортированные PNG, так как они больше не нужны.

Я использую этот веб-сайт для создания фавиконов, так как он содержит значки для экрана «Добавить на главный экран» для большинства устройств (Windows, macOS, Android, iOS) https://realfavicongenerator.net/

Чтобы преобразовать SVG в файл ICO, вы можете использовать: https://redketchup.io/icon-editor и опцию: «Создать значок из изображения».

Необходимые инструменты: inkscape и gimp

1. inkscape: экспортируйте SVG в png 64x64.
2. gimp: создайте новый проект с прозрачным фоном и размером слоя 64x64 и импортируйте изображение png в слой.
3. продублируйте слой, перейдите в «Слой»> «Масштабировать слой»> выберите 32x32.
4. еще раз продублируйте последний слой и повторите масштабирование для 16x16, 8x8
5. экспортируйте изображение в .ico, и вы увидите все слои, которые будут встроены в один файл .ico. (убедитесь, что у вас нет пустых слоев)

Хотя большинство онлайн-инструментов не справились с этой задачей (и преобразовали их в .ico с одним разрешением), я наткнулся на один, который отлично работал: https://anyconv.com/svg-to-ico-converter/

Он преобразовал мой файл .svg в .ico с 9 различными разрешениями, от 16x16 до 256x256.

Вот решение, @pillippe_bзавернутое в одну функцию BASH:

function svg2ico {
  basename=${1%.svg}
  inkscape -w 16 -h 16 -e "$basename_16.png" "$1"
  inkscape -w 32 -h 32 -e "$basename_32.png" "$1"
  inkscape -w 48 -h 48 -e "$basename_48.png" "$1"
  convert -verbose "$basename_16.png" "$basename_32.png" "$basename_48.png" "$basename.ico"
}

Остается только результирующий .icoфайл. Для этого необходимо установить Inkscape и ImageMagick:

sudo apt-get install inkscape imagemagick

Inkscape хорош, но он уже есть в Windows, и он занял бы много места в моей среде WSL . Благодаря предыдущему совету , за который я проголосовал, я использовал Imagemagick convert напрямую, чтобы изменить размер до разных разрешений, например, source.svgиз командной строки:

convert -resize 16x16 -background none source.svg 16.ico
convert -resize 32x32 -background none source.svg 32.ico

Что также достаточно просто для сценария. Обратите внимание, что это включает только одно разрешение. Согласно принятому ответу , для нескольких разрешений вы можете сначала convertсоздать несколько файлов png , а затем объединить их все, например convert 16.png 32.png 48.png 64.png 128.png favicon.ico.

Необходимо использовать -background none , потому что по умолчанию используется белый цвет, «если ничего не указано или не найдено на изображении». Конечно, удалите его, если вам действительно нужно сохранить фон.

Довольно круто иметь возможность использовать convertтакие вещи, как точное изменение размера изображения JPG при преобразовании его в PNG, используя команду, аналогичную приведенной выше.

Например:

convert -resize 700 path/to/original.jpg path/to/resized.jpg

Изменит размер original.jpg до ширины 700 пикселей, сохраняя соотношение сторон, в новый файл resized.jpg . Один из самых интуитивно понятных инструментов командной строки, которые я использовал!