사이드 프로젝트에 활용 가능한 무료 아이콘 사이트

프로젝트를 진행할 때 로고, 아이콘 등 다양한 것들이 필요합니다

이때 하나하나 직접 만들 수도 있지만 만들 시간이 없거나 어도비, 일러스트레이트 같은 툴을

다룰 줄 모르는 사람들은 만들 수 없습니다

이럴 때 사용 가능한 편리한 사이트가 있습니다

 

 

구글에 폰트 어썸을 검색하면 맨 처음 등장하는 사이트입니다

폰트 어썸 : https://fontawesome.com/

Font Awesome

위 링크를 이용하면 바로 해당 사이트로 이동합니다

사용법은 간단합니다

왼쪽의 "Start for Free" 버튼은 무료 사용

오른쪽의 "Get More with Pro" 버튼은 유료 사용입니다

왼쪽 버튼을 클릭합니다

 

이메일 주소를 인증하라고 나옵니다

빈칸에 자신의 이메일 주소를 입력합니다

입력한 주소로 폰트 어썸에서 발송한 메일이 옵니다

해당 메일을 열면 링크가 있는데 그 링크를 프로젝트에 붙이면 사용 가능합니다

<script src="https://kit.fontawesome.com/문자조합.js" crossorigin="anonymous"></script>

위와 같은 스크립트 주소가 제공됩니다

프로젝트에 추가하면 별다른 방법 없이 바로 사용 가능합니다

 

사용방법

폰트어썸 사이트에 접속합니다

상단의 Icons를 클릭합니다

아래와 같이 아이콘 목록이 나타납니다

회색으로 반투명한 아이콘은 유료 버전(Pro)에서 사용 가능합니다

왼쪽 목록에서 Free를 클릭하면 무료 버전 목록만 나옵니다

이 중에서 원하는 아이콘을 하나 선택합니다

아이콘 화면으로 이동합니다

빨간 박스 사이에서 아이콘 옵션을 변경하거나 복사할 수 있습니다

"<i class="fas fa-ad"></i>" 부분을 클릭하면 자동으로 복사되고 자신의 프로젝트에 붙여 넣기를 하면

적용이 끝났습니다

<i class="fas fa-ad"></i>

SVG 타입으로 받아서 PNG, JPG 등으로 사용할 경우는

빨간 박스의 오른쪽의 아이콘을 누르면 다운로드됩니다

SVG 타입으로 저장되고 해당 파일을 다른 변환 사이트에서 변경하면 원하는 타입의 파일로 변경해서

사용 가능합니다