[CSS] filterでグラフィック効果を指定しよう!

1.filterとは?

filterプロパティは要素に適用するぼかしや色変化などのグラフィック効果を指定できます。

値の指定方法は以下の通りです。

{ filter: 値; }

値の指定方法

2.filterの使い方

それではfilterの使い方をみていきましょう。

.image01 {
 filter: contrast(200%)
}

contrast() 関数は入力画像のコントラストを調整します。

0%の値を指定すると完全にグレーの画像が作成されます。

100%の値を指定すると、入力画像は変更されません。

100%を超える値を指定すると、よりコントラストの高い結果が得られます。

補完時の空白値は1です。

他にも値を設定できるのでいろいろと試してみることをお勧めします!