이미지 회색으로 필터 씌우기

이미지를 웹에서 사용하다 보면,
컬러풀한 이미지를 사용할때가 많은데,
웹디자인이랑 안어울려 모든곳에 잘 어울리는 회색톤으로 이미지를 변경해서 사용해야 될 순간이 있다.

그럴때,
어떻게 설정하면 좋을까?

.gray-tone {
    filter: grayscale(100%);
}

나의 경우에는 간단하게 gray-tone 이라는 클래스를 하나 만들어서 필요한 순간순간에 사용하고 있다.

요즘 웹에서는 풀스택 프레임워크들이 하두~~~ 많이 나와서,
더 쉽고 빠르게 하는 방법들이 많지만,
난 개인적으로 늙은이라 그런가..? 무진장 하드코딩이 편할때가 있다.

프레임워크도 너무 다양해서, 다 쉽긴한데..
다들 조금씩 조금씩 다르니깐 이것 저것 사용하다보니 헷갈리는 경우가 종종있다.

Code-Bold font

폰트 하나 마음에 들어서 소개하고 오늘은 이만 사라지도록 하겠다.