color-contrast()

Экспериментально: Это экспериментальная технология experimental technology
Перед использованием в производстве внимательно ознакомьтесь с таблицей совместимости с браузерами.

Функциональная запись color-contrast() принимает значение color и сравнивает его со списком других значений color, выбирая значение с наибольшим контрастом из списка.

Синтаксис

color-contrast(wheat vs tan, sienna, #d2691e)
color-contrast(#008080 vs olive, var(--myColor), #d2691e)

Значения

Функциональная запись: color-contrast(color vs color-list)

color: Любое допустимое значение <color>.
vs: Литеральное ключевое слово, как компонент синтаксиса.
color-list: Список, состоящий из как минимум двух значений цвета, которые нужно сравнить с первым значением. Разделены запятыми.

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

Спецификация
CSS Color Module Level 6 # colorcontrast

Совместимость с браузерами

	Рабочий стол					Мобильные устройства
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari на IOS	Samsung Internet	WebView Android
`color-contrast`	Нет	Нет	Нет	Нет	15	Нет	Нет	Нет	15	Нет	Нет

См. также

<color> тип данных
Модуль CSS colors
prefers-contrast и prefers-color-scheme возможности @media
contrast()
WCAG: контрастность цветов
Настраиваемые свойства CSS и var()

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/color-contrast