color-gamut

Baseline 2023

Новое доступно

С февраля 2023 года эта функция работает во всех последних версиях устройств и браузеров. Возможны проблемы с её работой на старых устройствах или браузерах.

Свойство color-gamut CSS функция среды используется для применения стилей CSS на основе приблизительного диапазона цветового диапазона цветопередачи, поддерживаемого агентом пользователя и устройством вывода.

Синтаксис

Функция color-gamut задаётся как одно из следующих значений цветовых пространств:

srgb: Агент пользователя и устройство вывода могут поддерживать примерно sRGB диапазон цветопередачи или больше. Это включает подавляющее большинство цветовых дисплеев.
p3: Агент пользователя и устройство вывода могут поддерживать примерно диапазон цветопередачи, заданный Display P3 цветовым пространством или больше. Диапазон P3 больше, чем sRGB и включает его.
rec2020: Агент пользователя и устройство вывода могут поддерживать примерно диапазон цветопередачи, заданный цветовым пространством ITU-R Recommendation BT.2020 или больше. Диапазон REC. 2020 больше, чем P3 и включает его.

Примеры

HTML

<p>This is a test.</p>

CSS

p {
  padding: 10px;
  border: solid;
}

@media (color-gamut: srgb) {
  p {
    background: #f4ae8a;
  }
}

Результат

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

Спецификация
Media Queries Level 4 # color-gamut

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

	Рабочий стол					Мобильный
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari on IOS	Samsung Internet	WebView Android
`color-gamut`	58	79	110	45	10	58	110	43	10	7.0	58

См. также

color() функция для указания цвета в определённом цветовом пространстве.
Модуль CSS цвета
@media правило at-правило, используемое для указания выражения color-gamut.
Использование запросов среды, чтобы понять, когда и как использовать запрос среды.
Модуль CSS запросов среды
sRGB на Википедии

© 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/@media/color-gamut