데스크탑에서 크롬을 위시한 모던 브라우저 사용률이 96% 이상을 차지하고 대부분의 모바일 브라우저들도 웹표준을 잘 맞춰주고 있는 현재, 이젠 꽤 자유롭게 js, css나 html의 최신 스펙을 자유롭게 사용할수 있는 환경이 되었다고 생각한다.
(물론 서비스의 형태에 따라 여전히 벗어날 수 없는 경우도 있겠지만..)
그런 점에서 새로 추가되는 스펙들을 항상 잘 캐치하고 공부해야한다고 생각은 하고 있었는데,
막상 2019년 크롬 76버전 이후로 지원하고 있었던 css backdrop-filter property를 이제서야 알게 되었다.
2018년 즈음 sketch를 쓸 때, 백그라운드 블러 효과가 무척 좋았는데 웹에서 구현하려면 효과 대비 드는 공수가 너무 많아 포기했던 경험이 있다. 그 후 그저 웹에서는 백그라운드 블러 효과는 쓰지 못하겠구나 라고 생각하고 있었는데, 우연한 기회에 검색을 해보니, backdrop-filter property를 통해 블러는 물론이고 기존 filter로 가능했던 대부분의 효과들을 배경을 기준으로 줄 수 있다는 사실을 알게되었다...
https://developer.mozilla.org/ko/docs/Web/CSS/backdrop-filter
한두달에 한번쯤은 최신 스펙들 몰아서 읽어보는 시간을 가져야겠다...
Dev & Design