PPT에 집 모양 하나가 필요해서 ‘무료 아이콘’을 검색했는데, 다운로드 버튼 옆에 출처 표시 문구가 붙어 있다. SVG는 받을 수 없고 PNG만 무료인 곳도 있다. 반대로 개발자용 아이콘 라이브러리는 파일 수가 적어 보여도 코드 한 줄로 바로 불러올 수 있다. 무료 아이콘 사이트는 자료량보다 사용 조건과 작업 방식부터 비교해야 한다.
이번 글은 Flaticon, Icons8처럼 검색해서 파일을 받는 플랫폼과 Lucide, Heroicons처럼 프로젝트에 설치하는 오픈소스 라이브러리를 함께 비교했다. 각 공식 페이지와 라이선스를 2026년 9월 11일 기준으로 확인했고, 같은 ‘home·search·user·calendar’ 아이콘을 찾을 때 무엇이 다른지도 실제 화면으로 살폈다.
![]()
먼저 결론부터 말하면 PPT와 블로그용 PNG를 빨리 찾을 때는 Flaticon 또는 Icons8, SVG 원본을 폭넓게 찾을 때는 SVG Repo, React 같은 웹 개발에는 Lucide, Google 스타일 UI에는 Material Symbols가 편하다. 다만 Flaticon과 Icons8의 무료 플랜에는 표시 조건이 붙을 수 있고 SVG Repo는 아이콘별 라이선스가 다를 수 있다. ‘상업용 무료’라는 검색어만 보고 바로 쓰면 안 되는 이유다.
![]()
비교 전에 꼭 알아둘 것: 무료는 한 종류가 아니다
아이콘 서비스의 무료는 크게 세 갈래다. 첫째는 무료 계정으로 내려받되 저작자 표시나 링크를 요구하는 방식이다. 둘째는 MIT, ISC, Apache 2.0 같은 오픈소스 라이선스로 배포하는 방식이다. 셋째는 사이트 안에서도 컬렉션이나 개별 아이콘마다 라이선스가 달라지는 방식이다.
![]()
여기에 브랜드 로고는 한 가지를 더 확인해야 한다. 아이콘 파일이 오픈소스라고 해도 Apple, Google, Instagram 같은 로고의 상표권까지 자유로워지는 것은 아니다. 해당 기업이나 서비스를 가리키는 정상적인 용도인지, 공식 파트너처럼 오인하게 만들지는 않는지 브랜드 가이드도 봐야 한다.
1. Flaticon — PPT와 콘텐츠 제작에 필요한 양이 압도적
Flaticon은 공식 검색 화면 기준 1,800만 개가 넘는 아이콘을 내세우는 대형 플랫폼이다. 같은 ‘home’을 검색해도 선형, 솔리드, 컬러, 3D 등 결과가 매우 많다. PNG·SVG·EPS·PSD 같은 여러 형식을 다루므로 발표자료, 블로그 도표, 인쇄물까지 폭넓게 찾기 좋다.
![]()
하지만 ‘무료’와 ‘무조건 무표시’는 다르다. Flaticon 공식 라이선스는 무료 라이선스로 개인·상업 프로젝트에 사용할 수 있는 범위를 안내하면서 저작자 표시를 요구한다. 프리미엄 이용은 표시 의무가 달라진다. 아이콘 자체를 별도 상품처럼 재판매하거나 원본에 가까운 형태로 재배포하는 것도 피해야 한다.
픽셀의 추천 용도는 PPT, 카드뉴스, 블로그 설명 이미지다. 검색 결과가 너무 많다는 것이 오히려 단점이어서, 첫 아이콘을 고른 뒤에는 같은 디자이너나 같은 팩의 아이콘만 이어서 쓰는 편이 완성도가 높다.
2. Icons8 — 한 화면의 스타일을 맞추기 쉬운 플랫폼
Icons8는 Windows, iOS, Material, Fluent처럼 스타일 체계별로 아이콘을 탐색하기 좋다. 단순히 ‘검색 아이콘 하나’를 찾기보다 앱 전체에 필요한 home·search·user·calendar를 한 스타일로 맞출 때 강하다. 색과 크기를 조절하고 PNG나 벡터 형식으로 활용하는 작업 흐름도 제공한다.
주의점은 무료 계정 조건이다. Icons8 공식 라이선스 문서는 무료 계정의 웹사이트·소셜미디어 사용에 Icons8 링크 등 구체적인 표시 조건을 둔다. 유료 플랜과 무료 플랜의 권한, 편집 가능 범위도 같지 않다. 따라서 “Icons8은 상업용으로 다 무료”라고 쓰는 대신 내가 받는 자산과 계정 등급의 조건을 확인해야 정확하다.
UI 시안을 빠르게 만들거나 운영체제 느낌에 맞는 아이콘 세트를 찾는 디자이너에게 추천한다. 다만 납품물이라면 클라이언트가 출처 표시 조건을 받아들일 수 있는지 먼저 확인하자.
3. SVG Repo — SVG 원본을 빠르게 찾되 배지를 확인
SVG Repo는 이름 그대로 SVG를 검색하고 내려받는 데 초점을 둔 사이트다. 같은 키워드에 다양한 컬렉션이 함께 노출되고, 색상이나 스타일을 살핀 뒤 벡터 원본으로 가져가기 편하다.
![]()
가장 중요한 점은 사이트 전체를 하나의 라이선스로 생각하면 안 된다는 것이다. SVG Repo의 공식 라이선스 안내는 자산이 SVG Repo License, CC0, MIT, Apache 등 서로 다른 조건으로 제공될 수 있음을 설명한다. 검색 결과에서 마음에 드는 그림을 골랐다면 상세 페이지의 라이선스 배지를 다시 열어야 한다.
SVG를 직접 편집할 줄 알고 여러 출처를 비교하는 디자이너에게 특히 편하다. 반대로 팀 전체에 일관된 규칙이 필요하면 MIT 하나로 관리되는 단일 라이브러리가 더 단순할 수 있다.
SVG와 PNG는 무엇이 다를까
SVG는 좌표와 선으로 그리는 벡터 형식이라 크게 확대해도 선명하다. CSS로 색과 크기를 바꾸거나 SVG 코드를 직접 수정할 수도 있어 웹·앱 UI에 유리하다. PNG는 픽셀 이미지라 편집 자유도는 낮지만 PowerPoint, 문서, 블로그 편집기에 바로 넣기 쉽다.
![]()
웹사이트라면 대체로 SVG가 낫지만 무조건은 아니다. 복잡한 컬러 일러스트를 수백 개의 경로로 만든 SVG는 파일이 커질 수 있고, 외부에서 받은 SVG에는 불필요한 스크립트나 메타데이터가 포함될 가능성도 있다. 신뢰할 수 있는 공식 배포처에서 받고 빌드 과정에서 최적화하자.
4. Lucide — React 개발자에게 가장 먼저 권할 깔끔한 선
Lucide는 Feather Icons에서 이어진 오픈소스 아이콘 프로젝트로, 공식 사이트는 현재 1,800개가 넘는 아이콘을 제공한다. 24×24 그리드의 단정한 라인 스타일이고 색상, 크기, 선 굵기를 조절할 수 있다. React, Vue, Svelte 등 다양한 패키지를 제공하며 필요한 아이콘만 포함하는 tree-shaking도 강조한다.
![]()
Lucide 공식 라이선스는 ISC다. 상업 프로젝트에도 쓰기 편한 간결한 라이선스지만 저작권과 허가 고지를 유지해야 한다. 대시보드, SaaS, 개인 웹서비스처럼 얇고 중립적인 아이콘이 필요한 프로젝트에 잘 어울린다.
단점은 컬러 일러스트나 화려한 3D 아이콘을 찾는 용도가 아니라는 점이다. 아이콘이 주인공이 아니라 인터페이스의 길잡이가 되어야 할 때 선택하자.
5. Google Material Symbols — 앱 UI와 가변 스타일
Google Material Symbols는 Google Fonts의 공식 아이콘 탐색기에서 검색할 수 있다. Outlined, Rounded, Sharp 스타일과 채움, 굵기, 등급, optical size 축을 조절할 수 있어 같은 아이콘도 인터페이스 성격에 맞게 다듬기 쉽다.
![]()
Google의 공식 저장소는 Material Icons와 Material Symbols를 Apache License 2.0으로 제품에 통합할 수 있다고 밝힌다. 웹폰트로 불러오거나 SVG를 사용할 수 있지만, 외부 Google Fonts 호출이 서비스의 개인정보·성능 정책과 맞는지도 검토해야 한다.
안드로이드 앱, 지도·설정·알림처럼 익숙한 기호가 중요한 서비스에 적합하다. 반대로 독특한 브랜드 인상이 핵심인 제품이라면 그대로 쓰기보다 일관된 커스텀 아이콘 체계를 검토할 수 있다.
6. Font Awesome Free — 오래된 생태계와 다양한 사용 방식
Font Awesome은 웹 개발에서 오래 쓰인 대표 아이콘 생태계다. Free와 Pro가 함께 있으므로 검색 필터에서 무료 아이콘인지 확인해야 한다. SVG, 웹폰트, JavaScript 패키지 등 적용 방식이 다양하고 자료와 예제가 많다는 것이 강점이다.
![]()
라이선스도 구성 요소에 따라 나뉜다. 공식 안내는 무료 아이콘, 폰트, 코드에 각각 적용되는 조건을 설명하며, 브랜드 아이콘은 해당 상표 소유자의 권리와 별개라고 명시한다. 이 글에서는 유료 Pro 자산이 아니라 Font Awesome Free만 추천 대상으로 본다.
기존 프로젝트가 이미 Font Awesome을 쓰거나 CMS 플러그인과 연결해야 할 때 편하다. 새 프로젝트라면 필요한 아이콘 몇 개 때문에 전체 폰트 묶음을 싣는 것보다 SVG 또는 개별 컴포넌트 방식이 더 가벼운지도 비교하자.
7. Heroicons — Tailwind UI와 잘 어울리는 단정한 세트
Heroicons는 Tailwind CSS 제작진이 만든 아이콘 세트다. 공식 페이지에서 316개 아이콘과 16px·20px·24px 크기, outline·solid 변형을 탐색할 수 있고 React·Vue 패키지와 Figma 파일도 제공한다.
![]()
공식 저장소는 MIT 라이선스로 배포한다. 수천 개를 무작정 제공하기보다 제품 UI에서 자주 쓰는 기호를 정돈된 비율로 제공한다는 쪽에 가깝다. Tailwind 기반 랜딩페이지와 관리 화면을 빠르게 만들 때 특히 자연스럽다.
아이콘 수가 필요한 개념을 모두 덮지 못할 수 있다는 것이 한계다. 부족한 아이콘만 다른 패밀리에서 섞으면 선 굵기와 모서리가 달라 보이므로, 실제 필요한 목록을 먼저 검색해 본 뒤 채택하자.
8. Tabler Icons — 선택 폭이 큰 2px 라인 아이콘
Tabler Icons는 공식 페이지 기준 6,000개가 넘는 아이콘을 제공하는 대형 오픈소스 세트다. 24×24 그리드와 기본 2px 스트로크를 사용하고 SVG, React, Vue, Svelte, Figma 등 여러 작업 흐름을 지원한다.
![]()
Tabler 라이선스는 MIT다. 아이콘 수가 많아 전문 도구나 관리자 화면처럼 세부 기능을 표현해야 하는 프로젝트에서 Lucide보다 원하는 기호를 찾기 쉬울 때가 있다.
선 아이콘이 매우 많다는 것은 장점이지만, 화면에서 선택한 크기와 스트로크가 일관되어야 한다. 16px처럼 작게 쓸 때는 복잡한 아이콘의 내부 선이 뭉치지 않는지 실제 기기에서 확인하자.
9. Bootstrap Icons — Bootstrap 없이도 쓸 수 있다
Bootstrap Icons는 Bootstrap의 공식 오픈소스 SVG 아이콘 라이브러리다. 현재 공식 문서는 2,000개가 넘는 아이콘을 제공하며 개별 SVG 복사, SVG 스프라이트, 아이콘 폰트 등 여러 사용 방식을 안내한다. 이름 때문에 오해하기 쉽지만 Bootstrap CSS 없이도 사용할 수 있다.
![]()
공식 GitHub 저장소는 MIT 라이선스다. Bootstrap 기반 사이트나 전통적인 서버 렌더링 페이지에서 문서를 따라 빠르게 적용하기 좋다. 솔리드에 가까운 형태가 많아 작은 크기에서도 존재감이 있다.
다른 라인 아이콘 세트와 섞으면 무게감 차이가 날 수 있다. 내비게이션 전체는 Bootstrap Icons, 특정 브랜드 로고만 별도 자산처럼 역할을 나누는 편이 낫다.
10. Phosphor Icons — 굵기 변형이 필요한 제품 디자인
Phosphor Icons는 thin, light, regular, bold, fill, duotone처럼 한 아이콘을 여러 굵기와 표현으로 제공하는 유연한 패밀리다. 같은 기호로 기본·선택·강조 상태를 표현하기 좋아 제품 디자인과 프로토타입에 유용하다.
![]()
Phosphor의 공식 core 저장소는 MIT 라이선스로 공개돼 있고 React, Vue, Flutter, Swift 등 생태계별 프로젝트도 운영한다. 귀엽고 부드러운 곡선이 있으면서도 기능 아이콘의 일관성을 유지하기 좋다.
여러 굵기를 쓸 수 있다고 한 화면에서 thin과 bold를 무작위로 섞어도 된다는 뜻은 아니다. 선택 상태처럼 의미 있는 규칙을 먼저 만들고 굵기 변화를 제한해야 한다.
같은 home 아이콘도 제품의 표정이 달라진다
아이콘은 뜻만 전달하는 작은 그림이 아니다. 얇은 선은 가볍고 정교해 보이고, 굵고 둥근 선은 친근하다. 솔리드는 작은 화면에서 빠르게 인식되며, 듀오톤과 컬러 아이콘은 주목도가 높다. 한 화면에서 서로 다른 패밀리를 섞으면 글꼴을 여러 개 섞은 것처럼 산만해진다.
![]()
실제로 고를 때는 home, search, user, calendar 네 단어를 모두 검색해 보자. 첫 번째 아이콘만 예쁜 세트보다 내가 필요한 핵심 기능 전체가 같은 분위기로 준비된 세트가 더 좋은 선택이다. 빈 상태, 오류, 결제, 공유처럼 서비스 고유 기능도 미리 목록에 넣으면 중간에 라이브러리를 바꾸는 일을 줄일 수 있다.
상업용 프로젝트라면 다운로드 전 4가지를 기록하자
첫째, 개인용인지 회사·고객 납품용인지 정한다. 둘째, 개별 아이콘 상세 페이지의 라이선스와 무료·유료 플랜을 확인한다. 셋째, 필요한 SVG·PNG·컴포넌트 형식을 고른다. 넷째, URL과 라이선스 버전, 확인 날짜를 프로젝트 문서에 남긴다.
![]()
나중에 사이트 정책이 바뀌어도 어떤 조건으로 받았는지 설명할 수 있기 때문이다. 아이콘 파일을 그대로 묶어 판매하거나 다운로드 가능한 원본 형태로 노출하는 행위는 많은 서비스가 제한한다. 템플릿 판매, 로고 제작, 앱 안의 스티커 마켓처럼 아이콘 자체가 상품 가치의 중심이라면 일반적인 웹 UI보다 훨씬 엄격하게 원문을 확인해야 한다.
디자이너용 최종 추천
PPT와 블로그 제작 속도가 중요하면 Flaticon과 Icons8이 편하고, 편집 가능한 SVG 원본을 넓게 찾으려면 SVG Repo가 좋다. Figma와 제품 UI에서는 Material Symbols, Heroicons, Tabler, Phosphor처럼 패밀리 규칙이 선명한 세트가 관리하기 쉽다.
![]()
이 여백이 말을 하고 있어요. 아이콘을 많이 넣는 것보다 버튼 주변에 충분한 공간을 주고, 같은 선 굵기와 같은 캔버스 규칙을 지키는 것이 훨씬 고급스럽다. 컬러 아이콘은 한 화면의 핵심 행동 한두 곳에만 쓰고 나머지는 중립적인 단색으로 정리해 보자.
개발자용 최종 추천
React·Vue 프로젝트라면 Lucide, Heroicons, Tabler 같은 패키지형 라이브러리부터 본다. Google의 시각 언어와 익숙한 UI가 필요하면 Material Symbols, 기존 생태계와 폭넓은 카테고리가 필요하면 Font Awesome Free를 검토할 수 있다.
![]()
번들 크기도 확인하자. 아이콘 폰트 전체를 내려받는 방식은 적용이 단순하지만 쓰지 않는 아이콘까지 포함될 수 있다. 패키지가 tree-shaking을 제대로 지원하고, 실제 빌드에 필요한 컴포넌트만 들어가는지 번들 분석으로 확인하는 편이 좋다. 외부 CDN 장애나 정책 변경이 중요한 서비스에 영향을 주지 않도록 자체 호스팅도 비교할 만하다.
아이콘 접근성: 예쁘게 보이는 것만으로는 부족하다
텍스트 ‘검색’ 옆의 돋보기처럼 장식적인 SVG는 aria-hidden="true"로 보조기술에서 숨기는 것이 좋다. 반대로 돋보기만 있는 버튼에는 aria-label="검색"처럼 기능 이름이 필요하다. 버튼의 실제 터치 영역은 모바일에서 최소 44×44px로 잡아야 누르기 쉽다.
![]()
성공은 초록색, 오류는 빨간색으로만 구분하지 말고 체크·느낌표 모양과 텍스트를 함께 쓴다. 16px 크기에서 획이 뭉치지 않는지, 다크 모드와 고대비 모드에서도 경계가 보이는지도 확인하자. 아이콘 안에 중요한 글자를 넣었다면 같은 정보를 주변 텍스트와 대체 텍스트로도 제공해야 한다.
자주 묻는 질문
무료 아이콘을 회사 홈페이지에 써도 되나?
가능한 자산이 많지만 사이트 이름만으로 단정할 수 없다. Flaticon·Icons8은 무료 계정의 표시 조건을 보고, SVG Repo는 개별 아이콘의 라이선스를 확인한다. MIT·ISC·Apache 라이브러리도 고지 유지 등 원문 조건을 따른다.
SVG 색을 바꾸면 출처 표시가 없어지나?
아니다. 색이나 크기를 수정했다고 원래 라이선스가 사라지지 않는다. 오히려 일부 서비스는 무료 계정에서 허용하는 수정 범위를 별도로 둔다. 다운로드 당시 약관과 개별 자산 조건을 확인해야 한다.
PPT에는 SVG와 PNG 중 무엇이 좋나?
최근 PowerPoint에서 SVG 편집이 가능한 환경이라면 SVG가 선명하고 색을 바꾸기 쉽다. 호환성이 중요한 구형 환경이나 단순 삽입은 투명 배경의 고해상도 PNG가 편하다. 발표할 PC에서 미리 열어 보는 것이 안전하다.
앱 로고도 무료 아이콘으로 만들어도 되나?
권하지 않는다. 일반적인 UI 기호와 달리 앱 로고는 브랜드를 식별하는 핵심 자산이고 상표 등록 가능성도 고려해야 한다. 아이콘 라이선스가 로고·상표 사용을 제한할 수 있으므로 전용 디자인을 만드는 편이 안전하다.
픽셀의 한 줄 선택법
자료를 빨리 찾는 사람은 Flaticon, 스타일 통일이 중요한 디자이너는 Icons8, SVG 탐색은 SVG Repo, React 개발은 Lucide부터 보면 된다. Google식 앱 UI는 Material Symbols, Tailwind 프로젝트는 Heroicons, 방대한 라인 아이콘은 Tabler, 여러 굵기가 필요하면 Phosphor가 좋다. Bootstrap Icons와 Font Awesome Free는 기존 웹 생태계와 연결할 때 여전히 강하다.
그러나 최고의 아이콘 사이트는 파일 수가 가장 많은 곳이 아니다. 내가 필요한 아이콘이 한 스타일로 모여 있고, 라이선스를 팀이 이해할 수 있으며, 실제 크기에서 잘 읽히는 곳이다. home 하나를 고르기 전에 search·user·calendar까지 같은 화면에 놓아 보자. 그 5분이 완성도와 라이선스 사고를 함께 줄여 준다.
참고 자료
- Flaticon 공식 라이선스
- Icons8 공식 라이선스 문서
- SVG Repo 라이선스 안내
- Lucide 공식 사이트 및 ISC 라이선스
- Google Material Design Icons 공식 저장소
- Font Awesome 공식 라이선스 안내
- Heroicons 공식 저장소
- Tabler Icons 공식 라이선스
- Bootstrap Icons 공식 저장소
- Phosphor Icons 공식 core 저장소
각 서비스 이름과 로고는 해당 권리자에게 있으며, 본문 화면은 서비스 비교와 설명을 위해 공식 페이지 일부를 캡처했다. 라이선스와 요금제는 바뀔 수 있으므로 실제 다운로드 시점의 공식 문서를 다시 확인하자.
