© 2014 сайт

Режимы наложения или смешивания слоёв в Adobe Photoshop определяют то, каким образом каждый из слоёв в многослойном изображении будет взаимодействовать с нижележащими слоями. Иными словами, от режима наложения зависит математический алгоритм смешивания значений взаимоперекрывающихся пикселей двух и более слоёв.

Режимом наложения по умолчанию для любого слоя является Normal. Чтобы изменить режим наложения, следует воспользоваться выпадающим меню Blending Mode, расположенном в палитре слоёв (Layers), и выбрать нужный режим из списка.

Классификация режимов наложения

В Adobe Photoshop имеется 27 режимов наложения или смешивания слоёв, каждый из которых может быть отнесён к одной из шести групп в зависимости от типа взаимодействия между слоями. В меню Blending Mode группы режимов визуально разделены при помощи горизонтальных линий, но не подписаны. Если вам неинтересно читать про группы, вы можете сразу перейти к практическим примерам .

1. Нормальные режимы : Normal (Нормальный) и Dissolve (Растворение). При непрозрачности 100% пиксели верхнего слоя просто замещают собой пиксели нижнего, не испытывая на себе никакого влияния последних. При уменьшении непрозрачности пиксели нижнего слоя либо проступают сквозь пиксели верхнего (Normal), либо частично замещают их (Dissolve).
2. Субтрактивные режимы : Darken (Замена тёмным), Multiply (Умножение), Color Burn (Затемнение основы), Linear Burn (Линейный затемнитель), Darker Color (Темнее). Эти режимы, так или иначе, приводят к затемнению изображения. Их действие можно сравнить со смешением красок на бумаге, т.е. с субтрактивным синтезом цвета.
3. Аддитивные режимы : Lighten (Замена светлым), Screen (Осветление), Color Dodge (Осветление основы), Linear Dodge (Линейный осветлитель), Lighter Color (Светлее). В противовес субтрактивным режимам аддитивные режимы служат для осветления изображения по принципу смешения цветового излучения (аддитивный синтез цвета).
4. Комплексные режимы : Overlay (Перекрытие), Soft Light (Мягкий свет), Hard Light (Жёсткий свет), Vivid Light (Яркий свет), Linear Light (Линейный свет), Pin Light (Точечный свет), Hard Mix (Жёсткое смешение). Эти режимы воздействуют на яркость и контраст конечного изображения, делая тени темнее, а света – светлее.
5. Разностные режимы : Difference (Разница), Exclusion (Исключение), Subtract (Вычитание), Divide (Разделение). Формирование результирующего цвета осуществляется на основании разницы между цветами верхнего и нижнего слоёв.
6. HSL режимы : Hue (Цветовой тон), Saturation (Насыщенность) Color (Цвет), Luminosity (Яркость). HSL означает Hue, Saturation, Lightness, т.е. тон, насыщенность и светлота. Таким образом, HSL режимы осуществляют перенос одного или двух компонентов цветовой схемы HSL с верхнего слоя на нижний.

Практика

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

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

В качестве верхнего слоя я возьму текстуру песка.

Далее мы последовательно переберём для верхнего слоя все возможные режимы наложения и посмотрим, что из этого получится. В данных примерах я не преследую никаких художественных целей, а просто пытаюсь продемонстрировать механику смешивания слоёв в различных режимах. Для большей наглядности непрозрачность верхнего слоя будет составлять 100% для всех режимов, кроме Normal и Dissolve, для которых я поставлю 50%. При 100% непрозрачности эффект смешивания в этих режимах был бы незаметен, поскольку верхний слой полностью замещает нижний. Разумеется, в реальной жизни очень часто приходится использовать намного более скромные значения непрозрачности, чтобы эффект смешения не выглядел слишком кричащим.

Напомню, что непрозрачностью слоя можно управлять, используя два параметра: Opacity (Плотность) и Fill (Заливка). При этом для большинства режимов наложения Opacity и Fill действуют абсолютно одинаково с той лишь разницей, что Opacity воздействует как на сам слой, так и на применённые к нему стили, а Fill стили игнорирует. Однако восемь режимов (Color Burn, Linear Burn, Color Dodge, Linear Dodge, Vivid Light, Linear Light, Hard Mix, и Difference) реагируют на уменьшение параметров Opacity и Fill немного по-разному, и об этом не стоит забывать.

Во всех случаях, когда я привожу формулы, используемые Фотошопом для расчёта результирующего цвета, буква a будет обозначать значение яркости верхнего слоя, а b – нижнего. Минимальное значение равно 0 (чёрный цвет), максимальное равно 255 (белый цвет).

Нормальные режимы наложения

Стандартный и наиболее часто употребляемый режим. При 100% непрозрачности пиксели верхнего слоя полностью замещают собой пиксели нижнего, а при уменьшении непрозрачности нижний слой плавно проступает из-под верхнего.

При 100% непрозрачности выглядит так же, как и Normal. При уменьшении непрозрачности часть пикселей верхнего слоя в случайном порядке замещается пикселями нижнего.

Субтрактивные режимы наложения

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

Лучший режим для затемнения. Значение пикселей верхнего слоя умножается на значение соответствующих пикселей нижнего слоя и делится на максимальное возможное значение (255).

Формула режима: (a × b) ÷ 255 .

Если один из слоёв содержит чёрный цвет (0) – результирующим будет тоже чёрный. Если присутствует белый цвет (255) – результирующим будет цвет другого слоя.

Ещё более выраженное затемнение, чем в случае с Multiply. Света приглушаются сильнее, а цветовая насыщенность средних тонов возрастает.

Формула: 255 – ((255 – b) ÷ (a ÷ 255)) .

Темнее чем Multiply, но не такой насыщенный как Color Burn.

Формула: (a + b) – 255 .

Действует так же, как и Darken, выбирая наиболее тёмные пиксели из предложенных, с тем лишь отличием, что Darker Color не обращает внимания на индивидуальные цветовые каналы, и вместо этого сравнивает общие значения яркости пикселей. В результате – цвета используемых пикселей не искажаются.

Аддитивные режимы наложения

Этот режим противоположен режиму Darken. Если пиксели верхнего слоя светлее соответствующих пикселей нижнего, они сохраняются. Если же верхние пиксели оказываются темнее – они замещаются нижними. Сравнение значений яркости осуществляется поканально.

Режим Multiply наоборот. Эффективно и деликатно осветляет изображение. Клиппинг может возникнуть, только если один из слоёв уже содержит белые пиксели.

Формула: 255 – ((255 – a) × (255 – b) ÷ 255) .

Более грубое и интенсивное осветление, чем Screen. Характеризуется выбиванием светов и повышением цветовой насыщенности средних тонов.

Формула: (b ÷ (255 – a)) × 255 .

Ещё светлее, чем Color Dodge, но с более блеклыми цветами. Значения яркости попросту складываются.

Формула: a + b .

Как и в режиме Lighten сохраняются наиболее светлые пиксели из двух слоёв, но при этом учитывается лишь общая их яркость без оглядки на индивидуальные цветовые каналы.

Комплексные режимы наложения

Каждый из комплексных режимов представляет собой, по сути, комбинацию из двух противоположных по действию режимов смешивания: субтрактивного и аддитивного, действующих в комплексе. При этом к тёмным пикселям применяются субтрактивные методы, а к светлым – аддитивные. Таким образом, тёмные пиксели становятся темнее, а светлые – светлее, в результате чего контраст изображения возрастает.

Во всех комплексных режимах кроме Overlay оценка яркости производится на основании верхнего слоя. Там, где верхние пиксели темнее 50% серого цвета, применяется субтрактивный метод, если светлее – аддитивный. Пиксели верхнего слоя, окрашенные в нейтрально серый цвет (50%), не оказывают на нижний слой никакого влияния. В режиме Overlay аналогичным образом оценивается нижний слой.

К тёмным участкам изображения применяется режим Multiply, а к светлым – Screen. Оценка яркости производится по нижнему слою. Если создать копию слоя и применить к ней режим Overlay, эффект будет напоминать применение S-образной кривой .

Так же как и в режиме Overlay используется комбинация из режимов Multiply и Screen, но яркость исходных пикселей оценивается на основании верхнего слоя. Soft Light – наиболее удобный режим для аккуратного повышения контраста, поскольку он очень деликатно обращается с тенями и светами, не допуская их выбивания.

Использует комбинацию режимов Linear Burn и Linear Dodge для тёмных и светлых пикселей соответственно. Результатом является довольно жёсткое повышение контраста.

Комбинация режимов Color Burn и Color Dodge. Действует ещё более интенсивно, чем Hard Light.

Комбинация режимов Linear Burn и Linear Dodge.

Комбинация режимов Darken и Lighten.

Действует также как и Linear Light (сочетание Linear Burn и Linear Dodge), но на пределе интенсивности, в результате чего в каждом из цветовых каналов пикселям присваивается либо минимальное (0), либо максимальное (255) значение яркости. Как следствие, цветовая палитра изображения в режиме RGB редуцируется до 8 цветов: красного (255; 0; 0), зелёного (0; 255; 0), синего (0; 0; 255), голубого (0; 255; 255), малинового (255; 0; 255), жёлтого (255; 255; 0), чёрного (0; 0; 0) и белого (255; 255; 255).

Разностные режимы наложения

Сравниваются значения яркости верхнего и нижнего пикселей, и из большего значения вычитается меньшее. Таким образом, результирующее значение соответствует разности исходных значений. Наличие белого цвета на одном из слоёв приводит к инверсии любого другого цвета. Чёрный цвет не оказывает никакого влияния. Очевидно, что пиксели одинакового цвета взаимопогашаются и становятся чёрными, поскольку их разность равна 0.

Формула: (b ÷ a) × 255 .

Если пиксель верхнего слоя белый, результирующим будет цвет нижнего слоя. Пиксели одинакового цвета становятся белыми, при условии, что они не чёрные. Одинаковые чёрные пиксели остаются чёрными. Режим Divide работает поканально, что приводит к дополнительному искажению цветов.

HSL режимы наложения

Результирующий цвет имеет цветовой тон верхнего слоя, а насыщенность и светлоту нижнего.

Используются значения насыщенности верхнего слоя вместе со значениями цветового тона и светлоты нижнего.

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

В противовес режиму Color сохраняет светлоту верхнего слоя, а значения цветового тона и насыщенности берёт из нижнего. Режим Luminosity полезен, когда изменяя яркость и контраст изображения вы стремитесь сохранить цвета неизменными. Это напоминает редактирование канала L при работе в цветовом пространстве Lab. Например, я обычно использую режим Luminosity при повышении резкости с помощью нерезкого маскирования, чтобы избежать появления цветных артефактов.

Спасибо за внимание!

Василий А.

Post scriptum

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

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

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

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

Описание режимов наложения

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

Раскрашивание с помощью hue и color

У всех режимов смешивания есть потенциал к изменению цвета графики, но особо полезны для раскрашивания два из них: цветовой тон (hue) и цветность (color).

Цветовой тон hue

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

Цветность color

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

Красно-коричневое наложение делает пиксели исходника красновато-коричневыми, также как и в режиме hue , но оно также придает им одинаковую насыщенность

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

Кроссбраузерное наложение

Используя эти режимы наложения, мы можем применять смешивание уровня Photoshop с помощью CSS. Но несмотря на то, что во всех браузерах используется одинаковая математика, вы можете заметить, что результаты иногда существенно отличаются.

Управление цветом это сложный мир и хотя W3C рекомендует использовать по умолчанию профиль sRGB, подход производителей браузеров различается - каждый браузер рендерит цвета согласно своим прихотям. Например, в Chrome рендеринг изображений основывается на “неуправляемом” цветовом пространстве, если в изображении не прописан цветовой профиль. Firefox работает также, но глубоко в его конфигурационных настройках запрятан флаг , устанавливающий sRGB по умолчанию для изображений с не указанным профилем. А Safari действует почти как Photoshop, так как графический API Apple основан на Adobe Postscript. Да, даже здесь есть свои отличия.

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

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

Применение режимов наложения

Режимы наложения можно применить с помощью пары свойств CSS: background-blend-mode и mix-blend-mode , также нам может пригодиться свойство isolation .

Наложение фоновых изображений

Свойство background-blend-mode смешивает изображения, указанные в декларации background-image . Это значит, что все изображения располагаются в стеке поверх друг друга и вы используете режим наложения, чтобы смешать их вместе.

Попробуем добавить пыль и царапины на фото. (Обратите внимание, что код предназначен для конкретных примеров).

.background { background-image: url("dust-and-scratches.jpg"), url("mountain.jpg"); background-blend-mode: screen; }

Вы можете использовать разные режимы наложения для каждой декларации background-image . Перечислите их в том же порядке, что и фоновые изображения и разделите запятыми. Последней декларации - самому нижнему слою автоматически задается нормальный режим наложения и это нельзя изменить. Если вы задали фоновый цвет с помощью background-color , то самым нижним уровнем будет он.

Иногда у вас может возникнуть потребность использовать цвет в качестве наложения. К сожалению, свойство CSS background-color ограничено одним цветом и это всегда будет самый нижний слой, независимо от того, объявлен ли он в начале списка фонов или нет. Рекомендация W3C предлагает нотацию image() , позволяющую использовать цвет в качестве изображения, но на данный момент это не поддерживается ни в одном браузере. К счастью, у нас есть обходной путь: так как градиенты в CSS рассматриваются как изображение, мы можем обмануть браузер, подсунув ему однотонный цвет с двумя идентичными точками останова.

Итак, осветлим изображение, как мы делали это ранее и изменим его цвет на сепию.

Background { background-image: linear-gradient(hsl(26, 24%, 42%), hsl(26, 24%, 42%)), /* sepia */ linear-gradient(hsl(316, 22%, 37%), hsl(316, 22%, 37%)), /* lavender */ url("dust-and-scratches.jpg"), url("mountain.jpg"); background-blend-mode: color, /* sepia */ screen, /* lavender */ screen; /* dust-and-scratches */ }

Наложение элементов HTML

Свойство mix-blend-mode задает режим наложения для элементов HTML, поэтому элементы на перекрывающихся слоях будут использовать его при смешивании с нижними слоями. Давайте опять добавим заглавие к изображению, удалив нежелательный белый фон заглавия с помощью режима multiply . Я также сделал элемент с изображением немного прозрачным, чтобы улучшить наложение цветов.

.background { background-image: linear-gradient(hsl(26, 24%, 42%), hsl(26, 24%, 42%)), /* sepia */ linear-gradient(hsl(316, 22%, 37%), hsl(316, 22%, 37%)), /* lavender */ url("dust-and-scratches.jpg"), url("mountain.jpg"); background-blend-mode: color, /* sepia */ screen, /* lavender */ screen; /* dust and scratches */ } .graphic { mix-blend-mode: multiply; opacity: 70%; /* overprint effect */ }

А вот пример использования mix-blend-mode для наложения нескольких элементов.

.red-disc, .green-disc, .blue-disc { mix-blend-mode: screen; }

Если вы не хотите, чтобы элемент в нижнем слое смешивался с каким-либо из верхних слоев, их можно отделить друг от друга с помощь третьего свойства: isolation . Это используется для наложения нескольких элементов без воздействия на базовый слой. Каждому из дисков в нашем примере задано mix-blend-mode в значение screen , что вынуждает их создавать новые цвета при пересечении. Но мы хотим, чтобы фотография горы не смешивалась с ними.

Background { isolation: isolate; }

Учитывайте, что mix-blend-mode применяется к элементу целиком, вместе со всеми его потомками. Это аналогично воздействию свойства opacity , делающему невидимым не только контейнер, но и его содержимое. Точно также и mix-blend-mode смешивает и контейнер, и содержимое.

Для следующего примера я немного поработал в Photoshop и создал набросок дизайна для вымышленного производителя лыжного оборудования Masstif. В этом наброске я создал блок с небольшим текстом и логотипом. Я смешал этот блок в режиме осветления цветов (color-dodge). Это дает четкий контраст по отношению к фону и помогает лучше сочетать текст и графику.

При попытке воспроизвести это средствами HTML и CSS, я рассчитывал, что работать будет следующий код:

.background { background-image: url("mountain.jpg"); } .ad-contents { background-color: white; mix-blend-mode: color-dodge; }

Но в результате содержимое смешалось с контейнером так, как на следующем изображении.

Также как отдельные проблемы с прозрачностью частично решаются за счет альфа-каналов фона, здесь мы тоже можем решить проблему с mix-blend-mode путем перемещения того, что возможно в фон. Вместо создания блока и наложения его с помощью mix-blend-mode , будет работать прием с конвертацией блока в background-image . Это не является решением для всех случаев, но попытаться стоит. Другого способа изолировать дочерние узлы от содержащего их смешиваемого элемента нет.

Поддержка в браузерах

Режимы наложения поддерживаются в большинстве основных браузеров, кроме Internet Explorer и Edge. Некоторый оптимизм есть в том, что реализация режимов наложения для Edge находится в стадии рассмотрения, а этот браузер уже поддерживает все режимы наложения для SVG, что дает шанс на скорую реализацию. Вы можете повлиять на процесс, проголосовав на сайте пожеланий для разработчиков Edge .

Также есть проблема с Safari - он не поддерживает режимы hue , saturation , luminosity и color .

Учитывайте, что в не поддерживающих режимы наложения браузерах, ваш дизайн не будет отображаться так, как вам надо. Это может все осложнить, пока вы не уверены, что у вашей аудитории достаточно продвинутые браузеры. Спрашивайте себя - приемлемы ли запасные варианты для вашей аудитории. Если нет - вам надо искать обходной путь.

Несмотря на эти предостережения, режимы наложения это отличное дополнение к инструментарию любого веб-дизайнера. Теперь мы можем добавлять прозрачность, тон и текстуру в наш дизайн с помощью CSS, причем делать это гибко и без компромиссов с качеством. Это означает увеличение возможностей для наших браузерах и наших рук.

Каждый слой имеет режим смешивания с ниже лежащим. По умолчанию режим смешивания «Normal» . Ниже приведено несколько примеров использования различных видов смешивани:

11 a. Normal

11 b. Dissolve

11 c. Overlay

Связь слоев

12. Слои могут быть связаны между собой. Нажмите слева от слоя (справа от значка глаза) чтобы связать этот слой с активным (внизу слева). В примере ниже, «paint», «palette» и «shadow» , были связаны вместе. При использовании инструментаMove , они будут двигаться как единое целое (внизу справа).

Меню палитры Layers

В палитре Layers есть меню, в которое можно попасть, нажав на маленький треугольник в правой части палитры. Есть несколько команд, которые доступны в этом меню. Например, в нашей выборке слоев, мы можем объединить«paint» с«palette» с помощью«Merge Down» .

13 a. Выберите слой «paint» .

13 b. Нажмите на маленький треугольник в правой части палитры. Затем в появившемся меню выбрать «Merge Down» .

13 c. Слой «paint» будет объединен со слоем «palette ».

Переименование слоя

14 a. Чтобы переименовать слой, дважды щелкните по нему в палитре Layers .

14 b. Введите новое имя в диалоговом окне и нажмите «ОК ».

14 c. Новое имя появится в палитре Layers .

Маска, строго говоря, это эквивалент выделенной области. Она сохраняется в документе в виде дополнительного канала, который можно увидеть в одноименной палитре. Ее прямое предназначение, как и у инструментов выделения, это определение области изображения для редактирования. В программе Adobe Photoshop, как известно, при наличии выделенной области, операции редактирования выполняются только над ней, остальные остаются, так сказать, «замаскированными». Маска позволяет закрыть те участки, которые не требуют изменений и должны оставаться нечувствительными к тому или иному инструменту. Однако умелое использование масок в Adobe Photoshop это нечто большее.

Для чего используют маски? Во-первых, в виде маски можно сохранить выделение, созданное, к примеру, инструментомВолшебная Палочка (Magic Wand Tool) , которое бывает достаточно трудоемким процессом, чтобы его выполнять снова и снова (команды? Save ion , Сохранить и ? Load ion, Загрузить). Во-вторых, в Adobe Photoshop существует инструментБыстрая Маска (Edit in Quick Mask Mode) , позволяющий быстро выделить объект с помощьюКисти (Brush Tool) . И наконец, в программе можно создатьмаску слоя (Layer mask) , которая значительно облегчает работу при монтаже и ретуши.

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

Секрет слой-маски в том, что ее можно воспринимать как скрытое черно-белое изображение, черные области которого прячут пиксели слоя, к которому эта маска прикреплена, а белые оставляют видимыми. Поэтому эффект следующий: когда вы рисуете кистью по маске слоя черным, изображение слоя исчезает, когда рисуете белым, оно возвращается. Как можно догадаться, это выгодно отличает использование маски слоя от применения Ластика (Eraser Tool) , поскольку маска лишь скрывает участки, а не удаляет их безвозвратно. Промежуточные серые тона Кисти также воздействуют на изображение, скрывая пиксели частично (пропорционально величине черной краски), однако частичное маскирование удобнее выполнять все же абсолютно черным цветом, изменяя параметрOpacity (Непрозрачность) самой Кисти, который находится на ее панели управления.

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

Теперь остается лишь поработать над краями верхних изображений. В палитреСлои (Layers) выберите слой с нужным вам изображением и там же нажмите кнопкуДобавить слой-маску (Add layer mask) - рядом с иконкой слоя появится иконка слой-маски в тонком ободке, который указывает на ее активность. Далее выберите инструментКисть , на панели управления которой выберите мягкую круглую подходящего размера, параметрНепрозрачность (Opacity) установите примерно равным 50%, на панели инструментов задайте для нее черный цвет (Set foreground color), и пробуйте ею рисовать. Изображение будет частично пропадать, поскольку мы рисуем по слой-маске черным цветом. Выберите для кисти белый и пробуйте рисовать теперь. Исчезнувшие пиксели вновь проявляются. Т. о. мы можем доводить плавные переходы между изображениями до желаемого результата, не боясь их испортить.

Для удобства лучше установить цвета переднего и заднего плана как черный и белый (по умолчанию), просто нажав клавишу D, а в процессе работы над слой-маской просто менять их местами, нажимая на двунаправленную стрелку на панели инструментов или на клавишу X. Стоит заметить также, что рисовать на маске слоя можно лишь когда она активна, что достигается щелчком по ее иконке. Но после щелчка по иконке слоя кисть будет рисовать на самом изображении.

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

В Adobe PhotoShop изображения состоят из одного или нескольких слоев. Что бы понять принцип, создадим новый документ, команда File- New, примерно с такими параметрами.

Теперь рассмотрим палитру Layers «слои». Там будет один активный слой- Background «фон». Если нажать на значок, помеченный красной стрелкой, будет создан новый слой, либо команда Layer- New-Layer.

Вновь созданный слой является активным, любое действие затронет только его. По умолчанию он прозрачный. Иконка, слева от надписи Background белого цвета, а Layer-1 в серую и белую шашечку (в Adobe PhotoShop это обозначение прозрачности). На панели инструментов выберете черный цвет переднего плана, а заднего белый. Далее выбираем инструмент Brush Tool «кисть», и на панели параметров выставляем примерно такие значения, как на следующем изображении. Нарисуем, что ни будь в открытом файле (правильное название «полотно»). Теперь на палитре Layers, слева от иконки слоя Layer-1, нажмем на «глазик». Только что нарисованное изображение исчезнет, станнит не видимым. При повторном нажатии на то место где был «глаз» оно снова появится. Далее нажимаем на надпись Background «фон», на палитре Layers, и этот слой становится активным (он стал темнее, что и указывает нам какой слой активный). Можно выбрать цвет переднего плана вместо черного к примеру красный. И наносим еще одно изображение, но теперь оно будет на слое Background. Что бы убедится, понажимаем на «глазики». Можно создать еще один слой, и поэкспериментировать.

Как вы поняли, управлять слоями можно на палитре Layers. Как создать слой, знаем, что бы удалить слой достаточно «захватить» его указателем и перетащить на корзину (синяя стрелка). Перетаскиванием так же можно изменить какой слой будет верхним, при этом он закрывает собой изображение нижележащего слоя. Слой Background по умолчанию заблокирован (справа от названия темный замочек), если дважды щелкнуть по замочку появится окно с предложением создания Layer-0, и он будет разблокирован. Если после этого его расположить сверху остальных слоев, он своим белым фоном закроет все. Прозрачность активного слоя можно изменить, изменив значение Opacity «непрозрачность». Красной стрелкой обозначена кнопка вызова меню слоев, где можно создать новый слой, создать копию слоя, связывать слои для совместного редактирования, объединять слои в один слой. Зеленой стрелкой обозначена кнопка при нажатии на которую, раскрывается список режима наложения для слоя. Если коротко, то режим наложения определяет, каким образом пиксели активного слоя взаимодействуют с другими слоями. На данном этапе нам нужен режим Normal. Один из методов переименовать слой, сделайте двойной левый клик непосредственно на буквах названия слоя и введите новое название.

Теперь о блокировках, черная стрелка. Их у нас четыре. Если нажать первый значок, в ряду Lock «блокировка», мы не сможем редактировать прозрачные пиксели, то есть наша кисть сможет рисовать только на не прозрачных участках активного слоя, можете сами убедиться. Второй значок, в виде кисточки, при нажатии его, заблокирует как не прозрачные, так и прозрачные пиксели. Третий значок, блокирует объекты слоя от перемещения. И четвертый значок, это полный «алес», полная блокировка, нельзя даже удалить заблокированный слой. Но можно перемещать между слоями (располагать выше или ниже других).

Еще один опыт. Создаем три новых слоя, удаляем слой Background. Остаются три прозрачных слоя. На каждом слои, кисточкой рисуем буквы. На первом букву«Р», на втором «О», на тратим «М». На панели инструментов выбираем инструмент Move Tool «перемещение». Подводим указатель к букве «М» на полотне, зажав левую кнопку мыши, перемещаем букву по нашему изображению. Делая операцию «перемещение» с другими слоями, получаем надпись «мор». Если щелкнуть на пустом квадратике (красная стрелка) не активного слоя, появится «цепочка», это связывание слоев, при этом мы сможем перемещать их вместе с активным слоем. Это элементарная работа со слоями, кроме этого к каждому слою можно применить множество эффектов и условий.

Последней совет, в процессе работы, если создано не 2-3 слоя, а больше, вновь созданным слоям желательно давать осмысленные названия. Бывает, что приходится работать с 20-30 слоями в одном файле, и тратится наше время на поиски нужного слоя.

Что такое корректировочный слой?

Согласно названию, корректировочный слой может изменять то или иное свойство вашей фотографии на отдельном слое. Что делает такой тип слоев уникальным так это то, что все изменения сделанные посредством такого слоя можно изменить или маскировать в любое время и удалять без пагубного воздействия на исходное изображение. Бывали ли вы в ситуации, когда при настройке яркости или цвета изображения после 30 и более изменений, вы захотели отменить все изменения, что вы проделали над изображением? Если использовали корректировочный слой, вы можете дважды кликнуть по нему и изменить все настройки. Без корректировочного слоя, вам придется отменять все действия, проделанные вами до этого момента. Корректировочные слои предоставляют вам большую гибкость.

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

Маскирование.

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

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

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

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

 Вы можете заполнить маску одним оттенком либо же вы можете использовать инструменты Paintbrush, Pencil, Eraser, Fill Bucket, Gradient и др. чтобы маскировать так, как вам нужно. Когда вы меняете оттенок маски, слой, к которому она прикреплена либо появляется, либо исчезает, там, где вы внесли изменения в маску. Таким образом, если вы хотите затемнить небо на снимке пейзажа и оставить остальное полотно нетронутым, вы примените для неба новый слой с настройками уровней или яркости и маскируете землю. На маске часть полотна, содержащая небо будет белой (позволяя тем самым просвечиваться содержимому), а часть полотна, содержащая землю, будет черной (не позволяя содержимому просвечиваться).

На картинке сверху небо выглядит слегка бледным, и я предпочитаю немного затемнить его. Если бы я затемнил все изображение, это бы сделало горы в нижней половине картинки слишком темными и детали стали бы не видны.	Я применю слой корректировки уровней (назовем его Слой 1) и настрою уровни так, чтобы затемнить небо. К сожалению, так как маска, прикрепленная к этому корректирующему слою, полностью белая, то эффект от этих действий распространится на всю картинку и горы станут слишком темными.	Верхний слой (Слой 1) является слоем корректировки уровней (это можно заметить по его иконке). Прикрепленная к нему маска (которая полностью белая) указывает Photoshop применить изменения уровней ко всему изображению..
При этой корректировке, мне нужно маскировать горы	Я использую большую кисть с нерезкой границей чисто черного цвета и закрашу ей горы на маске – это удалит эффект действия корректирующего слоя на этой области и сохранит нетронутым исходный оттенок гор.	Обратите внимание, что нижняя половина маски теперь закрашена черным. Это маскирует горы от слоя корректировки уровней.

Давайте попробуем.

Откройте ваше изображение и убедитесь, что панель слоев открыта.

Теперь давайте исправим небо. Сначала уберите выделение, которые вы использовали в предыдущем шагеCtrl-D на клавиатуре. Добавьте еще один корректирующий слой. В этот раз используйте слойкорректировки уровней. Во время корректировки уровней, сконцентрируйтесь на небе и пока игнорируйте изменения деревьев и воды. Перетащитечерный бегунок вправо, чтобы усилить отображение теней на облаках и придать небу немного четкости(7). Используйте значениеInput Level приблизительно равное80.
	Перемещение черного бегунка вправо усилит отображение теней на изображении.	Следите за небом и на данном этапе игнорируйте оставшуюся часть изображения.

Небо выглядит отлично, но уровни вконец испортили остальное изображение. Поэтому, давайте, используем маску, чтобы отменить корректировки, и закрасим ее только там, где нам нужно. Переименуйте корректировочный слой Levels 1 (который вы только что создали) в «Sky» и кликните по белой маске для этого слоя. Нажмите Ctrl-I чтобы инвертировать маску. Инвертирование превратит эту белую маску в черную и все корректировки будут скрыты черным. Поменяйте цвет переднего плана на белый и используйте инструмент Paint brush ,чтобы закрасить небо с корректировками уровней.

Деревья стали выглядеть лучше, но корректировки также применились и к остальному изображению. Поэтому давайте используем маску, чтобы отменить корректировки, и закрасим ее только там, где нам нужно. Переименуйте этот новый корректировочный слой (который вы только что создали) в "Trees " и кликните побелой маске для этого слоя. НажмитеCtrl-I , чтобы инвертировать маску. Инвертирование сделает эту белую маску черной и корректировки скроются черным. Поменяйте цвет переднего плана набелый и используйте инструментPaint brush , чтобы закрасить деревья с корректировкой уровней.
	Если вы сделали ошибку, измените цвет вашей кисти на черный и закрасьте нужное место, чтобы обратно скрыть его. Можно свободно переключаться между цветами переднего плана и фона, нажимая клавишу Х на клавиатуре.	Деревья закрашены белым цветом, что разрешает корректировку уровней только для этой области.

Конечный результат

Разница очевидна. Корректировочные слои позволил нам внести значительные изменения в оттенки, цвета и насыщенность и изолировать эти изменения только на те места, где они были нужны. Но самое важное по поводу этих изменений, что мы проделали, используя корректировочные слои это то, что их можно настроить или отменить в любое время ! Так и есть – дважды кликните по корректировочному слою, чтобы изменить исходные настройки или же отключите их вовсе на панели слоев.

 Выберите команду Layer>Layer Style (Слой>Стиль слоя) и выберите один из стилей.

 Выберите команду Blending Options (Параметры смешения) в меню палитры Layers.

 Выполните двойной щелчок на эскизе слоя в палитре (если это растровый слой).

 Щелкните на значке Add a layer style (Добавить стиль слоя) в левом нижнем углу палитры и выберите в меню один из стилей или команду Blending Options (Параметры смешения).

В диалоговом окне Layer Style вы можете выбрать один из эффектов. Для того чтобы в окне появились элементы управления, служащие для настройки определенного эффекта, необходимо первоначально выбрать его в списке слева. Если установлен флажок Preview (Предварительный просмотр), можно свободно экспериментировать, выбирая различные эффекты и меняя их настройки, наблюдая при этом перемены в вашем изображении.

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

Работа со слоями — одна из мощнейших возможностей фотошопа. Ни одна серьезная ретушь не обходится без работы со слоями.

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

Для начала разберем панель слоев.

Над слоями меню выбора режима наложения, непрозрачность (Opacity) и заполнение (Fill).

Примечание. Мне часто задают вопрос — чем Opacity отличается от Fill. Ответ такой — Fill влияет на прозрачность только пикселей слоя, а вот Opacity влияет на непрозрачность пикселей и эффектов слоя.

• Заблокировать прозрачные участки — вы сможете изменять только участки заполненные пикселями.
• Заблокировать пиксели изображений — предотвращает изменение пикселей с помощью инструментов рисования.
• Заблокировать позицию — предотвращает перемещение пикселей.
• Заблокировать слой целиком.

Нижняя часть панели:

• Создание связи между слоями — вы можете связать два и больше слоев или групп друг с другом. В отличии от выбора нескольких слоев, связанные слои сохраняют свою связь пока вы её не отмените.
• Применение эффектов к слоям — открывает выбор эффектов и их контролироль.
• Добавление маски к слою — создается обычная, белая маска, а если зажать Alt и нажать на кнопку, создается непрозрачная маска.
• Создание корректирующего слоя — в отличии от обычной коррекции, скажем Curves — корректирующий слой можно изменить в любой момент.
• Создание папки для слоев — очень удобно когда работаете с большим количеством слоев, группировать их.
• Создание нового слоя.
• Удаление слоя.

Теперь перейдем непосредственно к режимам наложения слоев.

Режимы наложения слоев

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

Basic — Основная группа

Normal — Пиксели верхнего слоя непрозрачны и потому закрывают нижний слой. Изменение прозрачности верхнего слоя сделает его полупрозрачным и заставит смешаться с другим слоем.

Dissolve — Комбинирует верхний слой с нижним используя пиксельный узор. Эффекта не будет, если верхний слой имеет 100% непрозрачность. Уменьшите прозрачность для проявления эффекта.

Darken — Группа затемнения

Darken — Сравнивает два источника и заменяет значения светлых пикселей значениями темных.

Multiply — Затемняет все изображение. Полезен при необходимости увеличить плотность светов и средних тонов. Multiply похож на просмотр напросвет двух наложенных друг на друга слайдов. Если верхний слой белый – изменений не произойдет.

Color Burn — Позволяет получить более темное изображение с увеличенной контрастностью. Если верхний слой белый – изменений не произойдет.

Linear Burn — Более “сильная” комбинация режимов наложения Multiply и Color Burn, темные пиксели преобразуюся в черные. Если верхний слой белый – изменений не произойдет.

Darker color — Похож на режим Darken, за исключением того, что работает на всех слоях сразу, а не на одном. Когда вы смешиваете два слоя, видимыми останутся только темные пиксели.

Lighten — Группа осветления

Lighten — Режим противоположный режиму Darken, затемняет темные пиксели более светлыми.

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

Color Dodge — Действие режима Color Dodge похоже на Screen, но заметно сильнее в светлых областях за счет проявления более насыщенных и контрастных цветов нижнего слоя. Основан на работе инструмента Dodge, который имитирует недодержку в фотографическом процессе.

Linear Dodge (Add) — Комбинация режимов Screen и Color Dodge; светлые значения преобразуются в белые. Если верхний слой черный – эффекта не будет.

Lighter Color — Сравнивает значения всех каналов обоих слоев и отображает более светлые пиксели.

Contrast — Группа увеличения констрастности

Overlay — Затемняет темные пиксели (Multiply) и осветляет (Screen) светлые, что приводит к увеличению контрастности без усечения теней и светов. Если верхний слой 50% серый – эффекта не будет.

Soft Light — Комбинация режима Dodge, который осветляет светлые пиксели, и режима Burn, который затемняет темные пиксели. Увеличивает контрастность чуть меньше чем режимы Overlay и Hard Light. Если верхний слой на 50% серый – эффекта не будет.

Hard Light — Использует тот же метод, что и режим Overlay, но эффект более сильный. Если верхний слой светлее 50% серого, то верхний слой осветяется через Screen, а если темнее — то затемяется через Multiply. Если верхний слой на 50% серый – эффекта не будет.

Vivid Light — Если верхний слой светлее 50% серого, то верхний слой осветяется через уменьшение контраста (Color Burn), а если темнее — то затемняется через увеличение контраста (Color Dodge) . Если верхний слой на 50% серый – эффекта не будет.

Linear Light — Похож на режим Vivid Light. Если верхний слой светлее 50% серого, то верхний слой осветяется через увеличение яркости (Linear Burn), а если темнее — то затемняется через уменьшение ярокости (Linear Dodge). Если верхний слой на 50% серый – эффекта не будет.

Pin Light — Комбинирует режимы Darken и Lighten для замены значений пикселей. Если верхний слой светлее чем 50% серый, пиксели осветляются через режим Lighten, а если темнее 50% серого — затемняются режим Darken. Если верхний слой на 50% серый – эффекта не будет.

Hard Mix — Осветляет светлые пиксели и затемняет темные пиксели до пороговых значений. Это приводит к чрезвычайной постеризации. Свечение верхнего слоя смешивается с цветом нижнего.

Comparative — группа сравнения

Difference — Представляет идентичные пиксели как черные, похожие — как темно-серые, а противоположные — как инвертированные. Если верхний слой черный — изменений не будет. Практическое применение этого режима можно увидеть в статье про замену фона .

Exclusion — Похоже на режим Difference, однако обеспечивает меньшую контрастность. Наложение на черный цвет не приводит к каким-либо изменениям, а наложение на белые пиксели — к инверсии сравниваемых значений, что приводит к их отображении серым цветом.

HSL — Группа компонентов изображения

Hue — Комбинирует свечение (Luminance) и насыщенность (Saturation) нижнего слоя с цветовым тоном (Hue) верхнего.

Saturation — Комбинирует свечение (Luminance) и цветовой тон (Hue) нижнего слоя с насыщенностью (Saturation) верхнего слоя.

Color — Комбинирует тон (Hue) и насыщенность (Saturation) верхнего слоя и свечение (Luminance) нижнего слоя.

Luminosity — Противоположный режиму Color. Комбинирует Luminance (cвечение) верхнего слоя и Hue (цвета) и Saturation (колебание цвета) нижнего слоя.

P.S.

Эти описания помогут вам понять что происходит при смешивании цветов. В следующей статье мы расскажем о корректирующих слоях и масках.

Позволяет вам использовать слои и режимы смешивания как основу для составления изображений.

Слои

Для того, чтобы попытаться понять «что такое слои изображения» рассмотрим две фотографии. Одна из них будет использоваться в качестве фона (или нижнего слоя), а другая - в качестве первого слоя, помещаемого над фоном:

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

Пиксели и прозрачность

Каждый слой в Paint.NET составлен из пикселей которые сохранены в формате RGBA. Часть аббревиатуры «RGB» обозначает цвета (красный, зеленый и синий) используемых, для передачи интенсивности цвета. Часть «A» (Альфа) обозначает переменную используемую, для хранения информации о прозрачности пикселя. Альфа может принимать значение от 0 (полностью прозрачный) до 255 (полностью непрозрачный). Другие программы могут использовать границы в пределах от 0 до 100 %.

Если пиксель прозрачен, то вместо его цвета будет показан цвет пикселя расположенного «под ним», тоесть цвет пикселя нижнего слоя. Для того, чтобы отобразить слоистое изображение на стандартном компьютерном мониторе, Paint.NET использует методику альфа-каналов.

Однако, прозрачные пиксели не могут быть отображены на компьютерном мониторе. Для того, чтобы как-то указать на прозрачность слоя, Paint.NET использует фон напоминающий изображение шахматной доски:

Прозрачность

Если вы видите такой фон, то это означает, что часть вашего изображения прозрачна. Изображение шахматной доски не является частью изображения. Вы можете думать об нем как о виртуальном или «нулевом» фоновом слое, который всегда расположен ниже всех остальных слоев отображаемых в окне Слои.

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

Слои и непрозрачность

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

Например, если мы возьмем верхний слой и постепенно уменьшим непрозрачность от 225 до 0 то получим нижеследующие изображения, показывающие слои в виде стопки слайдов и в том виде как это отображается на экране компьютера:

Верхний слой полностью непрозрачен

Верхний слой полупрозрачен

Верхний слой полностью прозрачен

Режимы смешивания

Режим смешивания слоя указывает как смешан слой со слоем лежащим под ним. Для смены режима смешивания, выделите требуемый слой в окне слоев, а затем откройте его свойства. Открыть свойства слоя можно специальной кнопкой в окне слоев или в . В любом случае откроется вот такое окно:

Не все названия режимов смешивания слоев «интуитивно понятны», поэтому в любом случае рекомендуется экспериментировать. Каждый режим смешивания описанный ниже применен к двум слоям рассмотренным выше с уровнем непрозрачности установленным на отметке 255.

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

Нормальный (Normal)
Стандартный режим применяемый по умолчанию. Каждый пиксель в слое смешивается с композицией в зависимости от значения прозрачности. Если верхний слой полностью непрозрачный он закрывает собой нижний слой полностью. При уменьшении прозрачности верхнего слоя начинает проступать нижний слой.

Умножение (Multiply)
Этот режим умножает видимые цвета нижнего слоя на цвета верхнего. В результате изображение становится более темным. При умножении белого с другим цветом, он не меняется. Подобный эффект получается при установке двух слайдов (один поверх другого) и направлении изображений на один экран.

Добавление (Additive)
Интенсивность цвета пикселей обоих слоев складываются вместе. Композиция, всегда ярче, за исключением полностью черных пикселей изображений.

Затемнение основы (Color Burn)
Создает эффект испепеления нижнего слоя под воздействием верхнего. То есть темные участки верхнего слоя используются для затемнения нижнего. Используется умножение цветов и увеличение насыщенности. Результат выглядит очень контрастно.

Осветление основы (Color Dodge)
Противоположность предыдущему режиму - нижнее изображение «выгорает» под воздействием верхнего цвета. При использовании этого режима светлые участки верхнего слоя усиливают яркость нижнего слоя. Темные участки не оказывают никакого воздействия. То есть наибольшие изменения происходят в сторону белого цвета.

Отражение (Reflect)
Этот режим смешивания может быть использован для придания блеска объектам или светлым участкам.

Свечение (Glow)
Тоже что и предыдущий режим, но как-бы после смены очередности слоев.

Перекрытие (Overlay)
В зависимости от интенсивности цвета пикселей слоя применяется режим«Экранное осветление» (для темных цветов) или «Умножение» (для светлых).

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

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

Замена светлым (Lighten)
При использовании этого режима, остаются только наиболее светлые цвета на обоих слоях, что приводит к более светлому изображению, чем при обычном наложении слоев.

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

Экранное осветление (Screen)
Противоположен режиму «Умножение» в том смысле, что перемножает цвет нижнего слоя с верхним слоем. В результате картинка посветлеет, как если бы мы проецировали её при помощи двух диапроекторов.

Исключение (Xor)
Этот режим в основном используется для анализа изображения, а не обработки изображения или композиции.