CSS Filterを試してみた。
CSS Filterを使えば、写真そのものを加工しなくても、ブラウザ上で彩度、明度、コントラスト等色調を変えて表示できる。
CSSは簡単。例えばグレースケールにしたければ、<img>にgrayscaleフィルタを指定するだけで良い。
-webkit-filter: grayscale(100%); filter: grayscale(100%);
明度を変えるなら、下のようにbrightnessフィルタを指定する。
-webkit-filter: brightness(1.2); filter: brightness(1.2);
実際に試したサンプルが以下。
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|