09.01.2024 в 14:45
Иван Белов
Kак смешать цвета в CSS?
Существует способ смешивать цвета в чистом CSS.
Функциональная запись color-mix() принимает два значения цвета и возвращает результат их смешивания в заданном цветовом пространстве на заданную величину. Теперь у него достаточно хорошая поддержка браузеров, и мы можем его использовать.
Эта функция принимает метод интерполяции цвета в качестве первого параметра и цвета в качестве других параметров.
div {
background-color: color-mix(in srgb, yellow, red);
}В результате мы увидим смешанный цвет желтого и красного.
Более того, мы можем управлять тем, сколько цвета следует использовать для смешивания нового.
div {
background-color: color-mix(in srgb, yellow, red 75%);
}В данном случае мы возьмем 25% желтого цвета и 75% красного цвета и смешаем их.
Не думайте, что эта функция будет использоваться так часто, но иногда она может оказаться полезной.
