Как сделать прозрачный фон графики в GIMP, гайд в 3 шага

Если GIMP уже установлен можно перейти непосредственно к его практическому использованию. В статье продемонстрировано, как сделать прозрачный фон в GIMP произвольного растрового изображения. Такая потребность часто возникает при проработке дизайна сайта, включая его отдельные графические компоненты, имеющие определенное функциональное значение.

Это могут быть: логотипы, заголовки-изображения, кнопки, иконки, водяные знаки, любая другая графика, часто создаваемая или редактируемая с использованием методов наложения слоев, включая составляющие разного уровня прозрачности.

Общий подход - коротко

Все элементарно. Необходимо открыть требуемый элемент графики (предпочтительно в формате .png) и прибавить к нему альфа-канал (ш.2 п.2), с помощью которого увязывается степень прозрачности с конкретным объектом. Далее фоновое обрамление объекта выделяется (ш.2 п.5), и очищается (ш.2 п.7), что сделает его прозрачным. На последнем этапе, уже измененные данные сохраняются в формате поддерживающем прозрачность (также предпочтительно в .png). На этом процесс преобразования заканчивается.

Важно понимать, одинаковый результат можно получить несколькими способами. К примеру в разделе ниже используется в основном главное горизонтальное меню расположенное в верхней части интерфейса, но существуют альтернативные варианты. Эффективное применение которых обычно приходит с практикой:

• использовать правую кнопку , когда курсор находится в любом месте рабочего поля в центральной части интерфейса;
• применять специальные клавиши на , которые являются альтернативой пунктам в выпадающих меню, необходимые подсказки находятся справа;
• пользоваться панелями в окнах слева и справа от непосредственно рабочей зоны проекта.

Сделать фон прозрачным - подробности

Предлагается рассмотреть весь процесс поэтапно на примерах преобразования иконки бургер. Также для разнообразия в завершении добавлен символ фавикон. Все действия с иными подобными элементами будут аналогичны.

1-й шаг - открытие файла

1. В верхнем горизонтальном меню, содержащего основные функции, щелкнуть на Файл (1), потом на пункт Открыть (2);
2. В середине рабочего поля откроется требуемый графический компонент (3), если он слишком мал, как в настоящем случае, то можно увеличить его масштаб, нажав на выпадающие варианты рядом со 100% (4);
3. В результате компонент (3) визуально будет увеличен (5).

2-й шаг - работа с прозрачным фоном

1. В основном списке функций найти и нажать следующую последовательность кнопок: Слой (1) → Прозрачность (2) → Добавить альфа-канал (3).
2. В левой верхней части набора инструментов найти и активизировать Выделение смежных областей (4), этот инструмент представлен виде «волшебной палочки».
3. Кликнуть на редактируемое обрамление, которое отобразится, как выделенное (5).
4. В главном списке функций найти и кликнуть на Правка (6) → Очистить (7) или, как пример с клавиатурой, просто нажать клавишу Delete.
5. Как итог, вышеперечисленных действий, фон данного компонента станет прозрачным (8).

Имеется нюанс. Не всегда фон очищается с первого раза, особенно в случае его сложной конфигурации, тогда приходится пункты 6 и 7 повторять до получения приемлемого уровня.

3-й шаг - сохранение

В зависимости от состояния конкретного проекта, способов сохранения результатов в основном два, каждый со своими особенностями.

Вариант 1

1. Файл (1) → Сохранить как ... (1-1).
2. Как результат, откроется окно с предложением сохранения измененной графической составляющей в формате .xcf . Если проект приходится прерывать с сохранением и последующим возобновлением редактирования, то имеет смысл оставить формат без изменений. В противном случае поменять в (2-1) на предпочтительный .png .
3. Также в (2-1) определиться с именем графического элемента (оставить прежний или придумать новый), указать место его нахождения (2-2), а в итоге нажать Сохранит (2).
4. Появится небольшое окно с сообщением, что это Неправильное расширение, необходимо Перейти к диалогу экспорта по предлагаемой ссылке (3).
5. Далее поочередно кликнуть на кнопки в появляющихся окнах Экспортировать (4) → Экспорт (5).

Вариант 2

Существует и простое решение, представлено на скрине ниже:

В меню Файл (1) → сразу перейти к Перезаписать ... (2) или Экспортировать как … (3) . В этом случае изображение сохраняется, как оно есть.

На этом процесс преобразования исходного фона в прозрачный завершается, а измененный объект сохраняется.

⚬ ⚬ ⚬

Таким образом, в статье представлено решение одной из популярных задач, как сделать прозрачный фон в GIMP любого растрового изображения.

В дальнейшем будет предложено продолжить освоение GIMP, что сделает возможным создавать разные другие нужные для сайта вещи (водяные знаки, анимацию, … ). А познания векторного редактора Inkscape позволят работать с графикой в .SVG .