dynamic-range

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since May 2022.

dynamic-rangeCSSメディア特性で、ユーザーエージェントおよび出力機器が対応している明るさ、コントラスト比、および色深度の組み合わせを検査することができます。

メモ: 一部の端末は、高ダイナミックレンジ機能を備えていますが、この機能は常に「オン」になっているわけではなく、アクティブ化する必要がある場合があります(プログラムによって、ユーザーによって、コンテンツに応じてなど)。このメディア機能は、ダイナミックレンジ機能がアクティブであるかどうかを検査するものではありません。端末が高ダイナミックレンジの映像を再生できるかどうかのみを検査します。

構文

dynamic-range 機能は、以下の一覧から選択したキーワードの値として指定します。

standard

この値は、あらゆる視覚的な端末と一致し、視覚機能のない端末は除外されます。high と一致するユーザーエージェントまたは出力機器は、standard 値とも一致します。

high

この値は、高いピーク輝度、高いコントラスト比、および RGB の色要素ごとに 24 ビットまたは 8 ビットを超える色深度に対応するユーザーエージェントおよび出力端末と一致します。ピーク輝度は、 LCD 画面などの発光デバイスが表現できる最も明るい点の明るさを指します。紙や電子インクなどの光反射型デバイスの場合、ピーク輝度は、少なくとも光を吸収する点を指します。コントラスト比は、システムが生成できる最も明るい色の輝度と最も暗い色の輝度の比率を指します。現在、ピーク輝度およびコントラスト比を正確に測定する方法はありません。また、高いピーク輝度および高いコントラスト比とは何であるかの判断は、ユーザーエージェントによって異なります。

css
@media (dynamic-range: standard) {
  p {
    color: red;
  }
}

@media (dynamic-range: high) {
  p {
    color: green;
  }
}

仕様書

Specification
Media Queries Level 5
# dynamic-range

ブラウザーの互換性

関連情報