png 파일 색 변경하는 방법

혁명이다. 이건..

비상..

 

 

flaticon 에서 아이콘을 받았지만 정작 필요한 회색은 없었다.

그래서 포토샵으로 바꿔야하나 싶었는데 , 포토샵을 설치해야되서 그러고 싶진 않았다.

 

https://codepen.io/sosuke/pen/Pjoqqp

CSS filter generator to convert from black to target hex color

 

위 코드펜으로 들어가서 다음 input 에 원하는 색상을 입력한다.

나 같은 경우에는 #808080 색상이 필요했다.

다음 처럼 filter 코드가 생긴다. 

이제 이 코드를 사용하면 색상을 바꿀 수 있다.

 

다음 처럼 filter 코드를 넣어주면 png 의 색상이 변경된다!

const CommentImg = styled.img`
  filter: invert(56%) sepia(0%) saturate(15%) hue-rotate(206deg);
`;

AMAZING~!

 

Respect 블로그

https://marinelifeirony.tistory.com/136

png 이미지 아이콘 파일 수정하지 않고 css로 색깔 변경하기