[React] react-icons 사용하는 방법

 

React 아이콘 사용하기


https://react-icons.netlify.com/#/ 여기 사이트로 접속하세요.

 

 

설치방법


yarn add react-icons

 

사용방법


저는 이 중에서 IonIcon을 사용해보겠습니다.
IonIcon 중에서도 갯수 다양하죠? 저는 닫기 아이콘을 사용해보겠습니다.
ctrl+f 를 누르고 찾기를 누르면 됩니다.


import { ICON_NAME } from "react-icons/io"; //예) import { IoIosClose } from "react-icons/io"; // 맨위에서 사용하고픈 아이콘을 골라 Icon_name에 써줍니다. *** <IoIosClose/> //위에서 불러온 형태 그대로 사용해줍니다.

 


옵션 추가


import { ICON_NAME } from "react-icons/io"; *** <IoIosClose size="24" color="#fff"/>

 이렇게 크기를 변형할 수도 색상도 변경할 수 있습니다. 

 

 



출처: https://grahams.tistory.com/161 [MakeDesire]