Blending mode: mix-blend-mode — CSS | MDN

mix-blend-mode | WebReference

Определяет режим наложения исходного цвета на фоновый цвет или фоновое изображение.

Краткая информация

Значение по умолчанию	normal
Наследуется	Нет
Применяется	Ко всем элементам
Анимируется	Нет

Синтаксис

mix-blend-mode: normal | multiply | screen | overlay | darken | lighten 
  | color-dodge | color-burn | hard-light | soft-light | difference | exclusion | hue 
  | saturation | color | luminosity

Синтаксис

	Описание	Пример
<тип>	Указывает тип значения.	<размер>
A && B	Значения должны выводиться в указанном порядке.	<размер> && <цвет>
A | B	Указывает, что надо выбрать только одно значение из предложенных (A или B).	normal | small-caps
A || B	Каждое значение может использоваться самостоятельно или совместно с другими в произвольном порядке.	width || count
[ ]	Группирует значения.	[ crop || cross ]
*	Повторять ноль или больше раз.	[,<время>]*
+	Повторять один или больше раз.	<число>+
?	Указанный тип, слово или группа не является обязательным.	inset?
{A, B}	Повторять не менее A, но не более B раз.	<радиус>{1,4}
#	Повторять один или больше раз через запятую.	<время>#

Значения

Значения, в целом, совпадают с режимами графических редакторов. Ниже описания взяты из руководства Adobe Photoshop.

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

• Основной цвет — исходный цвет.
• Совмещённый цвет — накладываемый цвет.
• Результирующий цвет — цвет, полученный в результате наложения.

normal

Обычный. Не используется смешивание цветов. Режим по умолчанию.

multiply

Умножение. В этом режиме значение основного цвета умножается на значение совмещённого цвета. Результирующий цвет всегда представляет собой более тёмный цвет. В результате умножения значения любого цвета на значение чёрного цвета вырабатывается чёрный цвет. В результате умножения значения любого цвета на значение белого цвета цвет остаётся неизменным.

screen

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

overlay

Перекрытие. В этом режиме цвета умножаются или осветляются в зависимости от основного цвета. Узоры или цвета перекрывают существующие пиксели, оставляя неизменными светлые и тёмные участки основного цвета. Базовый цвет не заменяется, а смешивается с совмещённым цветом, что позволяет отразить наличие светлых или тёмных участков первоначального цвета.

darken

Замена тёмным. В качестве результирующего выбирается основной или совмещённый цвет, в зависимости от того, какой из них темнее. Пиксели с цветом, более светлым по сравнению с совмещённым, заменяются, а пиксели с цветом, более тёмным по сравнению с совмещённым, остаются неизменными.

lighten

Замена светлым. В качестве результирующего цвета выбирается основной или совмещённый цвет, в зависимости от того, какой из них светлее. Пиксели с более тёмным цветом по сравнению с совмещённым цветом заменяются, а пиксели с более светлым цветом по сравнению с совмещённым цветом остаются неизменными.

color-dodge

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

color-burn

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

hard-light

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

soft-light

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

difference

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

exclusion

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

hue

Тон. В этом режиме создаётся результирующий цвет с яркостью и насыщенностью основного цвета и цветовым тоном совмещённого цвета.

saturation

Насыщенность. В этом режиме создаётся результирующий цвет с яркостью и цветовым тоном основного цвета и насыщенностью совмещённого цвета.

color

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

luminosity

Яркость. В этом режиме создаётся результирующий цвет с цветовым тоном и насыщенностью основного цвета и яркостью совмещённого цвета. Этот режим создаёт эффект инверсии цвета.

Песочница

normalmultiplyscreenoverlaydarkenlightencolor-dodgecolor-burnhard-lightsoft-lightdifferenceexclusionhuesaturationcolorluminosity

div {
  background: #C8EAF5;
}
img {  
  mix-blend-mode: {{ playgroundValue }};
}

Пример

<!DOCTYPE html> <html> <head> <meta charset=»utf-8″> <title>mix-blend-mode</title> <style> div { background: url(/example/image/aquaria. jpg) center no-repeat; /* Параметры фона */ text-align: center; /* Выравнивание по центру */ } div h2 { font: bold 4em Verdana, Helvetica, sans-serif; /* Параметры шрифта */ padding: 0.5em; /* Поля вокруг текста */ margin: 0; /* Обнуляем */ background: #fff; /* Белый цвет фона */ mix-blend-mode: lighten; /* Режим наложения */ } </style> </head> <body> <div><h2>Аквариум</h2></div> </body> </html>

В данном примере на фоновое изображение накладывается текст с белым фоном, который закрывает собой изображение. Режим наложения lighten оставляет лишь светлые цвета и поскольку цвет текста по умолчанию чёрный, то получаются цветные буквы на белом фоне (рис. 1).

Рис. 1. Текст после наложения на фон

Объектная модель

Объект.style.mixBlendMode

Примечание

Safari и iOS Safari не поддерживают значения hue, saturation, color и luminosity.

Спецификация

Спецификация	Статус
Compositing and Blending Level 1	Рекомендация

Спецификация

Каждая спецификация проходит несколько стадий одобрения.

• Recommendation (Рекомендация) — спецификация одобрена W3C и рекомендована как стандарт.
• Candidate Recommendation (Возможная рекомендация) — группа, отвечающая за стандарт, удовлетворена, как он соответствует своим целям, но требуется помощь сообщества разработчиков по реализации стандарта.
• Proposed Recommendation (Предлагаемая рекомендация) — на этом этапе документ представлен на рассмотрение Консультативного совета W3C для окончательного утверждения.
• Working Draft (Рабочий проект) — более зрелая версия черновика после обсуждения и внесения поправок для рассмотрения сообществом.
• Editor’s draft (Редакторский черновик) — черновая версия стандарта после внесения правок редакторами проекта.
• Draft (Черновик спецификации) — первая черновая версия стандарта.

Браузеры

		41	29	7. 1	32

Браузеры

В таблице браузеров применяются следующие обозначения.

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

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

Цвет и фон

См. также

• background-blend-mode

mix-blend-mode ⚡️ HTML и CSS с примерами кода

normalmultiplyscreenoverlaydarkenlightencolor-dodgecolor-burnhard-lightsoft-lightdifferenceexclusionhuesaturationcolorluminosity

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

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

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

Конечный цвет — результат multiply, если нижний цвет темнее или screen, если нижний цвет светлее. Этот режим смешивания эквивалентен hard-light, но со слоем обмена.

Конечный цвет состоит из самых темных значений каждого цветового канала.

Конечный цвет состоит из самых светлых значений каждого цветового канала.

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

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

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

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

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

Конечный цвет похож на hard-light, но мягче. Этот режим смешивания ведет себя аналогично hard-light. Эффект подобен сиянию рассеянного прожектора на заднем плане.

Конечный цвет — результат вычитания более темного из двух цветов из более светлого. Черный слой не действует, а белый слой инвертирует цвет другого слоя.

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

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

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

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

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

режимов наложения в Illustrator | Как работать с режимами наложения?

Режимы наложения полезны для изменения цвета объектов путем добавления эффектов наложения и цветов к выбранным объектам. Режимы наложения работают в зависимости от положения объекта на слое или группе. Мы подробно обсудим все доступные режимы наложения в Adobe Illustrator. До этого было бы легко запомнить несколько терминов, пытаясь понять различные режимы наложения:

1. Исходный цвет выбранного объекта всей группы известен как Blend Color.
2. Базовый цвет относится к цветам, расположенным под книгой иллюстраций.
3. Цвет, полученный после нанесения смеси, известен как Результирующий цвет
   .

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

Применять режимы наложения несложно; давайте разберемся в этом, выполнив следующие шаги.

Шаг 1: Первое, что нужно сделать, это перейти в меню Windows и выбрать прозрачность .

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

Шаг 3:  Используя инструмент формы, создайте два круга и разместите их, как показано на рисунке ниже.

Шаг 4: Теперь мы применим все режимы наложения, предлагаемые в режиме прозрачности, к созданным круглым формам и посмотрим на результаты.

Шаг 5: Режим по умолчанию — нормальный. Он ничего не делает и просто сохраняет базовый цвет таким же, как вы его выбрали.

Шаг 6:  При применении затемнения вы заметите, что перекрывающиеся части фигур становятся темнее. Он выбирает базовый или смешанный цвет на основе уровней темноты. Более светлые части, чем цвет наложения, изменяются, а более темные области остаются прежними.

Шаг 7: Он умножает смешанный цвет на базовый цвет, в результате чего получается более темный цвет. Если вы умножаете цвет на черный, он создает черный, а умножение на белые листья; цвет остается прежним.

Шаг 8:  Затемнение цвета затемняет перекрывающиеся области, чтобы отразить цвет смешения. Кроме того, если вы смешаете, используя белый цвет, это не внесет никаких изменений.

Шаг 9: Светлее выбирает более светлый цвет из основного или совмещенного цвета. Если область темнее, чем цвет наложения, она будет заменена, а области, которые светлее, чем цвет наложения, останутся прежними.

Шаг 10:  Экран увеличивает инверсию совмещенного и основного цветов. Это дает более светлый цвет на перекрывающихся областях. Если ваш экран черного цвета, вы не найдете никаких изменений, в то время как экран с белым цветом создаст белый цвет.

Шаг 11: Color Dodge увеличивает яркость основного цвета на основе совмещенного цвета. Это снова не имеет никакого эффекта, когда вы смешиваете с черным.

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

Шаг 13:  Делает цвета темнее или светлее в зависимости от смешиваемого цвета. Это создает эффект, похожий на рассеянный прожектор для вашего произведения искусства. Он может затемнять или осветлять цвета в зависимости от смешиваемого цвета. Если смешанный цвет светлее, рисунок становится светлым, а если темнее, рисунок становится темным.

Шаг 14:  Жесткий свет создает эффект резкого прожектора на вашей работе, как показано на изображении ниже. В зависимости от цвета смеси он усиливает или экранирует цвета. Если цвет наложения светлый, цвет экрана будет выглядеть ярким, а если темный, то изображение станет темным. Этот метод эффективен для добавления бликов или теней к вашим работам.

Шаг 15: Либо смешанный цвет, либо основной цвет вычитаются друг из друга в зависимости от того, какой из них имеет более высокий уровень яркости. Однако при смешивании с белым он меняет основной цвет на противоположный, а при смешивании с черным изменений не происходит.

Шаг 16:  Исключение создает эффект, идентичный разностному режиму; однако эффект имеет низкий контраст. При смешивании белого цвета основной цвет меняется на противоположный. А при смешивании черного вы вообще не заметите никаких изменений.

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

Шаг 18:  Учитывает яркость и оттенок основного цвета для получения конечного цвета. Для этого также используется насыщенность цвета наложения.

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

Шаг 20:  Создает результирующий цвет с оттенком и насыщенностью основного цвета и яркостью совмещенного цвета. Этот режим создает эффект, обратный эффекту цветового режима. Используя режим яркости, оттенок и насыщенность основного цвета и яркость совмещенного цвета объединяются для создания результирующего цвета. Он создает эффект, противоположный тому, который получается при использовании цветового режима. См. изображение ниже.

Заключение

Adobe Illustrator — один из самых эффективных и популярных редакторов векторной графики, которым пользуются миллионы профессионалов. Его используют дизайнеры, представители СМИ, художники и т. д. Он имеет множество инструментов и эффектов для создания потрясающих эффектов для ваших работ. В приведенной выше статье мы обсудили различные режимы наложения, доступные в Illustrator, улучшающие ваши творения. Практикуйте их на базовом уровне и медленно понимайте преимущества и преимущества эффектов, которые могут оказать на вашу работу. Надеюсь, что вы все будете расти и улучшать свои навыки обучения после освоения этих методов. Всего наилучшего!

Рекомендуемые статьи

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

1. Эффекты в Illustrator
2. фигур в иллюстраторе?
3. Инструмент сглаживания в Illustrator
4. Как сделать логотип в Illustrator?

Режим наложения | Webflow University

В этом видео используется старый пользовательский интерфейс. Скоро будет обновленная версия!

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

В этом уроке вы узнаете:

1. Что такое режим наложения
2. Как ведет себя каждый режим наложения
3. Как применить режим наложения к элементу

Что такое режим наложения

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

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

В этих примерах верхний элемент — ваш передний план — содержит текстовые элементы синего цвета (изображенные в левом поле). Нижние элементы — ваш средний план и фон — содержат желтые и пурпурные текстовые элементы (на фото справа).

Как ведет себя каждый режим наложения

В разделе Webflow Effects панели Style имеется 16 режимов наложения. Режимы, которые ведут себя одинаково, размещаются рядом друг с другом в раскрывающемся списке режимов наложения. Эти группы режимов состоят из:

• Режим по умолчанию (Нормальный)
• Режимы затемнения (Темнее, Умножение и затемнение цвета)
• Режимы освещения (Светлее, Экран и Осветление цветом)
• Режимы контраста (Наложение, Мягкий свет) , и Жесткий свет)
• Сравнительные режимы (Разница и Исключение)
• Составные режимы (Оттенок, Насыщенность, Цвет и Яркость)
  

Давайте рассмотрим, что делает каждый режим наложения, когда вы применяете его к верхнему элементу.

Режим по умолчанию

Обычный

Режим наложения Обычный является режимом наложения по умолчанию для элементов на холсте Webflow. Конечный цвет — это цвет верхнего элемента, независимо от цвета нижнего элемента. Эффект как будто 2 непрозрачных листа бумаги накладываются друг на друга.

Режимы затемнения

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

Затемнить

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

Умножение

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

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

Режим Color Burn

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

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

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

Светлее

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

Экран

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

Экран 9Режим 0009 может производить множество различных уровней осветления в зависимости от значений яркости верхнего элемента, что делает его удобным для осветления элементов или создания бликов.

Осветление цвета

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

Режимы контрастности

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

Цвета темнее 50% серого будут иметь эффект затемнения. К цветам ярче, чем 50% серого, будет применен эффект осветления.

Наложение

Режим наложения представляет собой комбинацию режима Умножение и Экран режимов, при этом нижний элемент всегда является доминирующим. Режим Overlay использует режим Screen с половинной интенсивностью для цветов светлее 50% серого и использует режим Multiply с половинной интенсивностью для цветов темнее 50% серого. 50% серого само становится прозрачным.

Еще один способ понять, как ведет себя Overlay mode , это рассмотреть, как он смещает средние тона. Более темные цвета верхних элементов смещают средние тона к более темным цветам, а более светлые цвета верхних элементов смещают средние тона к более ярким цветам.

Мягкий свет

Мягкий свет Режим во многом похож на режим Наложение . Он применяет эффект затемнения или осветления в зависимости от значений яркости, но гораздо более тонким способом. Вы можете думать о режиме Soft light как о более мягкой версии режима Overlay , без резкого контраста. Эффект подобен освещению рассеянным прожектором на фоне.

Жесткий свет

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

Сравнительные режимы

Режимы наложения в сравнительной группировке ищут различия между цветами верхнего и нижнего элементов для создания результата.

Difference

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

Исключение

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

Композитные режимы

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

Оттенок

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

Насыщенность

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