아이콘 플러그인 & 아이콘 직접 만들기

피그마에서 SVG 형식의 아이콘을 사용하기위해 피그마 플러그인들을 몇가지 사용해보았고, 원하는 아이콘이 없을땐 직접 만들어보았다.

 

피그마 아이콘 플러그인

Google material design icons

원하는 아이콘들을 검색해서 찾을 수 있다.  아이콘 종류가 많다고 느낌 프로 플랜으로 구입해야 제한 없이 사용할 수 있는 것 같다.(적용하다가 중간에 구매하라고 알림이 뜸..)

 

Material Symbols

원하는 아이콘들을 검색해서 찾을 수 있다. 종류가 많지는 않은 것 같은데 크게 부족함은 없는 듯? 아직 리밋 제한은 안걸렸는데 한도가 있을진 모르겠다.

 

 

아이콘 직접 만들기

플러그인에서 원하는 아이콘이 제한이 있어서 직접 만들어보았다.

 

① 24 x 24 사이즈의 빈 프레임 생성

 

② 선을 이용해서 원하는 아이콘 그리기

클립보드 저장 아이콘을 그려주었다.

 

③ 프레임 선택 후 Create component 클릭

 

컴포넌트로 만들기 버튼을 클릭하면 아래와 같이 테두리 색이 변하고, 아이콘 컴포넌트가 생성된다.

 

왼쪽 메뉴바의 Assets 에서 만든 아이콘이 추가된 것을 확인할 수 있다.

만든 아이콘의 색상을 변경해서 작업하고 있는 와이어프레임에 적용하였다.

 

 

피그마를 배우진 않았지만 기본적인 사용법들을 익히면서 내가 만들 프로젝트의 와이어프레임을 하나씩 만들고 있다.

조금 어렵지만 하나씩 만드는 과정이 재미있고, 이후 직접 만든 구조에 따라 개발할 생각에 기대가된다.