contrast()
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2016.
contrast()
は CSS の関数で、入力画像のコントラストを調整します。結果は <filter-function>
です。
試してみましょう
構文
css
contrast(amount)
引数
amount
-
結果のコントラストで、
<number>
または<percentage>
で指定します。100%
未満の値ではコントラストが下がり、100%
を超える値ではコントラストが上がります。0%
の値では画像が完全に灰色になり、100%
の値では入力が変更されないままになります。補間時の欠損値は1
です。
例
数値とパーセント値を使用した contrast の設定
css
contrast(0) /* 完全な灰色 */
contrast(65%) /* 65% のコントラスト */
contrast(1) /* 効果なし */
contrast(200%) /* 2 倍のコントラスト */
仕様書
Specification |
---|
Filter Effects Module Level 1 # funcdef-filter-contrast |
ブラウザーの互換性
BCD tables only load in the browser