Конвертировать изображение в маску

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

Я попытался преобразовать его в оттенки серого и изменить непрозрачность до 20%, но это привело к гораздо более темному изображению.

Я использую это на веб-странице, где администратор может установить цвет шаблона. Затем я использую что-то вроде этого в CSS:

background: #557d0d url("img/background.png") center center;

Использование Gimp 2.8.6 в Ubuntu.

Вы можете обесцветить изображение с помощью Colors > Desaturate.... Затем используйте Colors > Color to Alpha...для удаления серого, который делает его темнее ( #808080).

Установите непрозрачность до 40%, и это должно сделать.

Я только что провел небольшой тест на созданном мной сайте:

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

Вы можете довольно близко подойти, просто выбрав один из средних зеленых оттенков в центре изображения с помощью инструмента «Пипетка», максимально увеличив его насыщенность и значение и сделав этот цвет прозрачным, используя инструмент « Слой → Прозрачность → Цвет в альфа-канал ...» . Однако это приведет к тому, что ваш слой будет иметь цветовые оттенки сверху и снизу, чего вы, возможно, не захотите.

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

Один из способов сделать это будет:

1. Используйте инструмент Цвета → Компоненты → Разобрать ... , чтобы разложить изображение на слои в режиме HSV.

2. Удалите слой оттенка. Мы не будем его использовать.

3. Выберите слой насыщенности, откройте диалоговое окно « Слой → Маска → Добавить маску слоя ... », выберите режим «Копия слоя в оттенках серого» и установите флажок «Инвертировать маску».

4. Повторите шаг 3 для слоя значений.

5. Используя инструмент заливки заливки (в режиме «Заполнить все выделение»), заполните слой значений (а не его маску!) Всем черным, а слой насыщенности - белым.

6. Переместите слой значений над слоем насыщенности в стеке.

7. При желании, объедините слои вместе с помощью Image → Merge Visible Layers ... или Layers → Merge Down .

Результирующее полупрозрачное изображение в градациях серого должно выглядеть так:

^{Нажмите, чтобы скачать / просмотреть в полном размере.}

Хитрость в том, что после шагов 3–5:

• слой «насыщенности» будет чисто белым, если исходный цвет был насыщенным на 0%, и прозрачным, где он был насыщенным на 100%, и
• слой "value" будет чисто черным, если исходный цвет имел значение 0%, и прозрачным, если он имеет значение 100%.

Помещение этих двух слоев (или их объединенной комбинации) поверх чистого насыщенного цветного фона затем повторяет процесс преобразования цвета HSV в RGB: вы начинаете с чистого насыщенного цвета правильного оттенка, смешиваете достаточно белого, чтобы получить желаемый насыщенности, а затем смешайте достаточно черного цвета, чтобы получить желаемое значение.

Вот как выглядит полученное изображение на различных цветных фонах:

^{Цвета: зеленый ( #83ff00), синий ( #00aeff), оранжевый ( #ffa200), красный ( #ff002a).}

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

1. обесцветить изображение, чтобы получить изображение в градациях серого
2. установите белый (вы можете ввести #FFFFFF для белого в палитре цветов) в альфа
3. сохранить как png, чтобы сохранить прозрачность

• Откройте панель каналов.

• Решите, какой канал даст вам степень контрастности, которую вы ищете.

Способ 1:

• Выберите Image > Calculationsи используйте канал, который вы выбрали в качестве источника 1, тот же канал или «серый», что и в источнике 2, и «нормальный», как в режиме наложения. Выберите «Новый документ» в качестве пункта назначения.

• Измените режим нового документа на RGB или Greyscale и сохраните как png или jpeg.

Способ 2:

• Ctl / Cmd-клик по миниатюре выбранного канала.

• Edit > Copy или Ctl / Cmd-C

• File > New, принять размеры Edit > Pasteили Ctl / Cmd-V

• Удалить фоновый слой.

• Image > Mode > RGB

• Сохранить как 24-битный PNG с прозрачностью.

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

Двойной щелчок по слою, появится окно стиля слоя, в левой части найдите и выберите Gradient Overlay и измените цвет градиента в соответствии с вашими потребностями и нажмите OK, затем в окне Gradient overlay измените стиль на линейный и измените угол и масштаб в соответствии с твоя потребность