“contrast()”関数

“contrast()”関数

“contrast()”関数は入力画像のコントラストを調整する関数です。

“<filter-function>”値として使用することができ、“filter”プロパティで要素のコントラストを変更することができます。

引数は1個の“<number-percentage>”値で、“0”は“0%”、“1”は“100%”に対応します。

contrast(〚“<number-percentage>”値〛)


“0%”で完全な灰色の画像、“100%”で入力画像と同じ画像、“100%”より大きい場合は入力画像よりも高コントラストの画像を出力します。

省略時の既定値は“1”です。また、補間時の初期値は“1”です。

使用例

.filter-0 { filter: contrast(0%);}
.filter-2 { filter: contrast(20%);}
.filter-4 { filter: contrast(40%);}
.filter-6 { filter: contrast(60%);}
.filter-8 { filter: contrast(80%);}
.filter-10 { filter: contrast(100%);}
.filter-12 { filter: contrast(120%);}
.filter-14 { filter: contrast(140%);}
.filter-16 { filter: contrast(160%);}
.filter-18 { filter: contrast(180%);}
.filter-20 { filter: contrast(200%);}
.filter-22 { filter: contrast(220%);}


contrast(0%)

contrast(20%)

contrast(40%)

contrast(60%)

contrast(80%)

contrast(100%)

contrast(120%)

contrast(140%)

contrast(160%)

contrast(180%)

contrast(200%)

contrast(220%)

仕様書

定義されている仕様書

contrast()