[css]흑백 필터의 선명도를 낮추는 법

필자는 이미지에 흑백 필터 기능이 있는(하지만, 마우스 오버하면 원본으로 돌아가는) 홈페이지를 운영하고 있다.

완전 흑백 이미지

그런데 완전 흑백 말고, 흑백 필터의 선명도를 낮출 수 있는 방법은 없을까 고민하던 중, 방법을 찾았다.

---

 

　filter: grayscale(1); ←이 "1"이 선명도를 나타내는 것임. 0에 가까울 수록 흐릿하고, 1이 가장 선명함.

---

 

그리하여 filter: grayscale(1) 부분의 "1"을 "0.2"로 수정함. 선명도를 낮춤. 이러면 덜 흑백흑백 하겠지?

filter: grayscale(1) → filter: grayscale(0.2) 수정.

 

흑백 필터가 연해진 이미지

결과 : 약간 흑백 필터가 연해졌다. 컬러가 좀 보이네 :)