CSS_filter 아이콘 색상 변경

https://developer.mozilla.org/ko/docs/Web/CSS/filter

filter 속성으로 이미지 색상을 자유자재로 변경하기

이미지를 필터링을 주는 효과이지만
아이콘 이미지(png/svg) 원하는 색상으로 변경용으로 사용하기!

적용해보기

invert()
blur()

/* 색상반전 */
.user.two{
  border:2px solid blue;
  filter:invert();
}

/* 블러effect 0~px단위로 */
.user.three{
  border:2px solid blue;
  filter:blur(10px); 
}

단순한 반전이나 블러는 가능하지만 색깔을 다 바꾸려면
어쩌고 저쩌고 아래 필터 속성을 조합해야함=>겁나 복잡

CSS filter Color Generator

원하는 색생을 넣으면 속성을 알아서 조합해줌 :)!
1. Codepeni
https://codepen.io/sosuke/pen/Pjoqqp

2.한국어용
file:///C:/Users/MKKIM/AppData/Local/Temp/AZTMP1/CSS%20filter%20Color%20Generator.html

내가 원하는 연보라 넣어봄
뿅!! 예쁘게 잘 나옴🎆🎆

---

CSS는 재밌다..그동안 자바스크립트에 시달리고(?)
그룹프로젝트로 황폐해진 내 마음을 몽글몽글하게 해줌..