[react] react-icons 사용하기

1. 해당 프로젝트 터미널에 설치

npm install react-icons --save

 

 

2. 아이콘 사용

 

아래 사이트에서 원하는 아이콘을 찾아 이름을 복사한 뒤

React Icons

 

IconName에 붙여넣는다. (Ionicons 4를 사용때 예시)

import { IconName } from "react-icons/io";

 

코드에 적용

<div>
  <IoIosCheckmarkCircle/>
  <IoIosCheckmarkCircleOutline/>
</div>

 

 

3. 커스텀

 

<div>
  <IoIosCheckmarkCircle size="25px" color="rgb(57, 192, 255)" className='done'/>
  <IoIosCheckmarkCircleOutline size="25px" color="rgb(138, 218, 255)" className='yet'/>
</div>

이렇게 직접 스타일을 적용해줘도 되고

className이나 id를 사용해서 css에서 적용해줘도 된다.

 

 

아주 편하고 좋다 굿굿