Добавить прозрачность в существующий PNG

Я хотел бы использовать это изображение на веб-сайте.

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

Я использовал Gimp для преобразования изображения в .png, но как мне теперь действовать?

Инструмент GIMP Color to Alpha очень удобен, если вы знаете, как его использовать , и эта задача кажется особенно подходящей для него:

1. Откройте изображение в GIMP и при необходимости измените его на цветовой режим RGB.
2. Выберите « Слой» → «Прозрачность» → «Цвет к альфа» ...
3. Выберите черный ( #000000) в качестве цвета, чтобы сделать прозрачным.
4. Нажмите «ОК».
5. Сохраните полученное изображение в формате PNG:
   

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

Layer -> Mask -> Add layer mask

Установите переключатель « Selection» и обязательно установите флажок « Invert mask». Теперь все черные пиксели прозрачны.

Экспорт в формате PNG или GIF.

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

Я не использую gimp, но это изображение - простой случай, когда должно быть достаточно просто получить достойную прозрачность.

Если вы выберете все изображение, а затем используете его (или, скорее, версию в оттенках серого) в качестве альфа-канала, вы почти закончили.

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

Вот полезный метод GIMP, который я недавно использовал для этого - вероятно, похож на «Color To Alpha» (Color To Alpha был для меня серым, хотя я был в режиме RGB), но этот метод дал мне несколько полезных настроек для «софт» «Я хотел, чтобы края выходили наружу (в отличие от техник волшебной палочки, которые оставляют тонкую черную рамку вокруг изображения, а не делают края частично прозрачными).

Короче говоря, я скопировал версию исходного изображения в градациях серого в его маску слоя / альфа-канал, а затем использовал кривые на альфа-канале, чтобы сделать большую часть изображения непрозрачной при настройке прозрачности краев. Очень хороший эффект и очень настраиваемый.

Вот шаг за шагом, чтобы сделать это:

• Начиная со слоя с исходным изображением на нем, называемого «изображение»
• Дублируйте слой «image» на новый слой под названием «image alpha» (с помощью кнопки «Duplicate Layer» в диалоге «Layers»)
• Colors > Desaturate... > Lightness на слое "image alpha"
• Щелкните правой кнопкой мыши слой «изображение» и Add Alpha(если это еще не сделано)
• Скопируйте все «изображение альфа» (в слое «изображение альфа», Select All& Copy)

• Paste это на альфа-канал «изображения» (нажмите на правую иконку слоя «изображение», а затем вставьте его)

  • Предыдущие шаги, возможно, идентичны одной команде "Color to Alpha"

• Необязательно: щелкните правой кнопкой мыши «изображение» и Show Layer Mask(должно показать, что вы вставили). Если вы пропустите это, вы увидите изменение прозрачности в реальном времени на следующем шаге.

• Color > Curves
• В диалоговом окне «Кривые» сделайте плоскую кривую вдоль верхней части, а затем быстро уменьшайте ее влево, в результате чего большинство ярких пикселей станут полностью белыми (т. Е. Изображение там непрозрачно).

• Снимите флажок, Show Layer Maskчтобы увидеть примененную прозрачность.

  Перемещение точки насыщения Кривых (вверху кривых) и скорость, с которой она снижается, позволяет настроить, насколько края изображения прозрачны и насколько.

Вы можете использовать Adobe Photoshop. Перейти к выбору -> цветовой диапазон . Удерживая нажатой клавишу « Shift» , нажмите на цвет, который нужно удалить (черный в вашем случае). Нажмите ок. Тогда все ваши черные будут выбраны; Теперь нажмите Удалить.