필사 모드: 아이콘 라이브러리 2026 — Lucide / Heroicons / Phosphor / Tabler / Radix / FontAwesome 7 / Material Symbols / Iconify 심층 비교

프롤로그 — 아이콘 폰트 시대의 종언, SVG · 변수 폰트의 도래

2014년의 풍경을 떠올려 보자. 부트스트랩 3 시대의 `glyphicon`은 폰트 파일이었고, FontAwesome 4는 CSS의 `::before` 의사 요소로 그려졌다. 우리는 아이콘 하나를 위해 `woff2` 한 묶음을 다운로드했고, 색을 바꾸려고 `color: #fff`를 외쳤다.

2026년의 풍경은 달라졌다.

- **SVG가 표준**이다. 색 · 두께 · 사이즈를 자유롭게 조정하고, `currentColor`로 다크모드도 한 줄에 해결한다.

- **Variable Font**가 새 무기다. Google Material Symbols는 한 폰트 파일에 `weight 100~700`, `fill 0~1`, `grade -25~+200`, `opsz 20~48` 네 축을 담는다.

- **Iconify**는 200,000개 이상의 아이콘을 단일 API로 묶었다. Lucide도 Phosphor도 Tabler도 한 컴포넌트로 부른다.

- **Pro 라이선스**는 여전히 유효하다. FontAwesome Pro · Streamline · Iconjar 같은 유료 도구는 디자이너의 시간을 산다.

- **변수 폰트 + Tree-shaking + ESM**으로 번들 사이즈는 신경 쓸 일이 거의 사라졌다.

이 글은 2026년의 아이콘 라이브러리 풍경을 처음부터 끝까지 비교한다. 코드 한 줄을 쓰는 개발자, Figma에 모듈 시스템을 구축하는 디자이너, 그리고 그 사이에 끼어 "도대체 어디서 무엇을 골라야 하는가"를 묻는 모든 사람을 위해.

1장 · 2026년의 아이콘 지도 — 네 가지 분류

세상에 아이콘 라이브러리는 많다. 너무 많다. 그래서 먼저 분류부터 한다.

1.1 무료 OSS 라이브러리 (MIT/ISC/Apache)

가장 일반적인 선택. 작은 사이드 프로젝트부터 상용 SaaS까지 부담 없이 쓴다.

- **Lucide** — Feather의 정통 후속, 1500+ MIT, 가장 활발한 커뮤니티

- **Heroicons** — Tailwind 팀 제작, 296개의 정선된 아이콘

- **Phosphor Icons** — 5400+ × 6 weights, 디자인 일관성 최고 수준

- **Tabler Icons** — 4000+, MIT, 빠른 성장세

- **Iconoir** — Roman Cabrol, 미적 통일감

- **Radix Icons** — Radix UI 짝, 15×15 단일 크기

- **BoxIcons / Bootstrap Icons / Eva Icons / Remix Icon**

1.2 Pro · 상업 라이선스

디자이너 손에 들리는 도구. 라이선스를 산다는 건 정해진 일정에 맞춰 새 아이콘이 추가되고, 지원이 보장된다는 뜻.

- **FontAwesome 7 Pro** — Duotone · Sharp · Thin · Brands

- **Streamline 8** — 100,000개 이상의 일러스트 + 아이콘

- **Iconjar** — Mac 전용 아이콘 매니저, 자체 라이브러리 판매

1.3 디자인 시스템 부속 아이콘

기업 디자인 시스템이 자체 아이콘 셋을 같이 배포한다. 시스템 컬러 · 그리드 · 두께 규칙이 일관되도록 만들어졌다.

- **Material Symbols** (Google) — Material 3 디자인 시스템

- **Carbon Icons** (IBM) — Carbon Design System

- **Octicons** (GitHub) — GitHub 사이트 전용 아이콘

- **Radix UI Themes Icons** — Radix UI v3 컴포넌트와 한 쌍

1.4 변수 폰트 · 동적 가변

CSS 한 줄로 두께 · 광학 사이즈 · 그레이드를 조정한다. 2026년의 새 패러다임.

- **Material Symbols** — 4축 variable font

- **Iconoir Variable** — 베타, 두께 가변

- **Phosphor Variable** — 6 weights를 폰트 한 파일로

2장 · Lucide — Feather 후속, 1500+ MIT

[Feather Icons](https://feathericons.com)는 2017년 Cole Bemis가 만든 24×24 stroke 아이콘 셋이다. 2배 두께 stroke의 미니멀한 라인 스타일이 한 시대를 지배했지만, 2020년경부터 사실상 정체된다. 마지막 메이저 업데이트가 2018년이다.

**Lucide**는 그 정체에 대한 대답이었다. 2021년 ariperkkio · Eric Fennis 등이 Feather에서 포크해서 시작했고, 2026년 현재 1500개 이상의 아이콘과 30개 이상의 공식 패키지를 갖춘 가장 활발한 OSS 아이콘 라이브러리가 됐다.

2.1 왜 Lucide인가

- **Feather의 미학을 그대로 계승** — 24×24, 2px stroke, 라인 스타일

- **빠른 추가** — 매주 새 아이콘 PR이 머지된다

- **공식 React · Vue · Svelte · Angular · Solid 패키지**

- **Tree-shaking 최적화** — 사용한 아이콘만 번들에 들어간다

- **MIT 라이선스** — 상업 사용 무료

2.2 React에서 쓰기

npm install lucide-react

export default function Toolbar() {

return (

)

}

2.3 Lucide의 핵심 매력 — `currentColor` + stroke

모든 아이콘이 `stroke="currentColor"` 속성을 갖는다. 부모 요소의 `color`를 따라가므로 다크모드 한 줄.

2.4 Lucide Lab — 실험적 셋

`lucide-lab` 패키지는 본 라이브러리에 들어가기 전 단계의 아이콘들을 모아둔다. 정식 머지 후보들이 여기 있다.

2.5 한계

- 같은 stroke 스타일 한 가지뿐 (Phosphor의 다중 weight 부재)

- Feather 시절의 단순함은 미덕인 동시에 제약. 표현력이 필요한 일러스트성 아이콘은 부족하다.

3장 · Heroicons — Tailwind 팀의 296개 정선 셋

[Heroicons](https://heroicons.com)는 Tailwind CSS · Tailwind UI를 만든 Steve Schoger · Adam Wathan 팀의 작품이다. 2020년 v1 발표, 2026년 현재 v2.x.

3.1 Heroicons의 철학

- **296개 한정**. 일부러 적게. 다 외울 수 있는 양.

- **세 가지 변형** — `outline`(24×24, 1.5px stroke) · `solid`(24×24, fill) · `mini`(20×20, fill) · `micro`(16×16, fill)

- **`@heroicons/react` 단일 패키지**

- **Tailwind UI 컴포넌트와 같은 시각 언어**

3.2 사용 예

export default function Notification() {

return (

)

}

3.3 왜 Heroicons인가

- **Tailwind 사이트와 시각 일관성** — Tailwind 디자인 토큰에 자연스럽게 녹는다

- **변형 명확** — outline/solid/mini/micro의 사용 맥락이 명료

- **Solo PR로 일관성 유지** — 디자이너 한 사람의 손에서 나온 셋

3.4 한계

- 296개로 부족할 때가 잦다. 도메인 특수 아이콘(코딩 · 의료 · 자동차)이 거의 없다.

- 추가 요청은 보통 거절된다. "Use Iconify or Lucide" 답변이 흔하다.

4장 · Phosphor Icons — 5400+ × 6 weights

[Phosphor Icons](https://phosphoricons.com)는 Rafael Conde · Helena Zhang의 작품. 2021년 v1 출시 후 2026년 현재 v2.1, 5400개 이상의 아이콘을 6가지 두께 변형으로 제공한다.

4.1 6 가지 weight

| Weight | 설명 | 사용 맥락 |

|---|---|---|

| Thin | 0.75px stroke | 럭셔리 · 미니멀 |

| Light | 1px stroke | 모던 일반 UI |

| Regular | 1.5px stroke | 기본 권장 |

| Bold | 2px stroke | 강조 · 모바일 작은 사이즈 |

| Fill | 단색 채움 | 활성 상태 · 토글 |

| Duotone | 두 색 채움 | 일러스트성 강조 |

같은 아이콘이 6가지 모습으로 존재한다 — 일관성이 보장된 채로.

4.2 React에서

npm install @phosphor-icons/react

export default function Gallery() {

return (

)

}

4.3 Phosphor의 강점

- **5400개 이상** — 카테고리가 넓다 (의료 · 게임 · 카지노 · 음악 · 책 등)

- **6 weight 시스템** — 토글 onActive 표현에 Fill 사용이 자연스럽다

- **Duotone** — 마케팅 페이지 · 빈 상태 일러스트에 잘 어울린다

- **MIT 라이선스**

- **Figma 플러그인 + Sketch 라이브러리 + iOS · Flutter 패키지**

4.4 한계

- 5400개는 양이지만, 결국 디자이너 두 사람의 손에서 나온다. 새 아이콘 PR은 받지만 빈도가 Tabler보다 느리다.

- Duotone의 두 색 시스템을 자기 디자인 토큰에 맞추는 건 조금 손이 간다.

5장 · Iconoir — Roman Cabrol의 아름다움

[Iconoir](https://iconoir.com)는 Luca Burgio · Sam Pollman · 그리고 디자이너 Roman Cabrol의 작품. 2021년 시작, 2026년 현재 약 1600개의 24×24 stroke 아이콘.

5.1 왜 Iconoir인가

- **시각적 통일감** — 한 사람의 손에서 나온 듯한 일관된 stroke와 곡선

- **MIT 라이선스**

- **React · Vue · React Native · Flutter · Tailwind 공식 패키지**

- **CSS 폰트 패키지 별도** — `iconoir-css` 한 줄 임포트

5.2 사용 예

5.3 Iconoir vs Lucide

둘 다 24×24 stroke 라이브러리지만 미감이 다르다.

- **Lucide** — Feather 정통, 더 기계적 · 기능적

- **Iconoir** — 더 부드러운 곡선, 일러스트성이 약간 있음

A/B 테스트하기 좋다. 디자이너 취향에 따라 갈린다.

5.4 한계

- Lucide만큼의 커뮤니티 모멘텀은 없다

- 1600개는 작은 셋

6장 · Tabler Icons — 4000+ 빠른 성장

[Tabler Icons](https://tabler.io/icons)는 폴란드의 codecalm 팀이 만든 24×24 stroke 셋. 2020년 시작, 2026년 현재 4900개 이상으로 성장 중.

6.1 왜 Tabler인가

- **4900개+ 아이콘** — 양적으로 압도적

- **Outline + Filled 두 변형**

- **MIT 라이선스**

- **새 아이콘 추가 속도가 빠르다** — 격주 단위 릴리스

- **React · Vue · Svelte · Solid · Astro · Web Components 공식 패키지**

6.2 React에서

npm install @tabler/icons-react

export default function Nav() {

return (

)

}

6.3 Tabler의 진짜 가치 — 도메인 다양성

Lucide · Iconoir에 없는 아이콘이 Tabler에는 있다.

- 자동차 · 운송 (`IconCar`, `IconBus`, `IconShip`)

- 의료 · 헬스 (`IconStethoscope`, `IconHeartbeat`)

- 게임 · 카지노 (`IconDice`, `IconChess`)

- 통화 · 결제 (수백 개)

- 브랜드 로고 (수백 개)

스타트업 SaaS에서 "거의 다 Tabler 하나로 끝나는 경험"이 흔하다.

6.4 한계

- 양이 많아서 일관성이 살짝 흔들리는 경우가 있다 (특히 브랜드 로고)

- React 19와의 Server Component 호환은 최근에야 정리됐다

7장 · Radix Icons / Radix UI Themes Icons

[Radix](https://www.radix-ui.com)는 WorkOS 산하의 디자인 시스템 · 컴포넌트 라이브러리다. 두 갈래의 아이콘 라이브러리가 있다.

7.1 Radix Icons (`@radix-ui/react-icons`)

- **15×15 단일 크기**

- **약 300개 아이콘**

- **단일 stroke 스타일**

- **MIT 라이선스**

7.2 Radix UI Themes Icons

Radix UI v3와 같이 쓰는 동반 아이콘 셋. Themes의 시각 토큰(scale, accent, gray)에 잘 어울린다.

7.3 왜 Radix를 골라야 하나

- **Radix UI 컴포넌트와의 시각 일관성**이 절대 가치

- 다른 라이브러리(Lucide · Heroicons)와 섞어 쓰면 미세한 격차가 보인다

- 15×15라는 작은 사이즈에 최적화 — 메뉴 · 툴팁 · 작은 버튼에 잘 맞는다

7.4 한계

- 300개로 도메인 커버리지 부족 — Tabler · Phosphor와 섞어 써야 할 일이 잦다

- 다양한 사이즈를 원하면 `transform: scale()` 필요 (디자인적으로 권장 X)

8장 · FontAwesome 7 — 클래식 + Free + Pro

[FontAwesome](https://fontawesome.com)은 2012년 시작된 가장 오래된 아이콘 라이브러리. 2026년 현재 v7.

8.1 FontAwesome 7의 구성

- **Free** — 약 2000개 무료

- **Pro** — 32,000개 이상, 8가지 스타일 (Classic · Sharp · Duotone · Light · Regular · Solid · Thin · Brands)

- **Sharp Duotone** v7 신규 추가

- **Kit** — 사용자별 CDN 패키지 + 분석 + 호스팅

8.2 React에서

npm install @fortawesome/react-fontawesome @fortawesome/fontawesome-svg-core @fortawesome/free-solid-svg-icons

8.3 왜 여전히 FontAwesome인가

- **브랜드 인지도** — 비개발자 PM/디자이너도 안다

- **WordPress · Drupal · 레거시 호환** — 폰트 방식의 CSS만 임포트하면 끝

- **Brands** — 1000개 이상의 브랜드 로고 (Pro 라이선스)

- **Kit** 으로 호스팅 · 분석 · 서브셋팅 자동

8.4 한계

- 모던 React 환경에서는 `@fortawesome/react-fontawesome` 임포트 패턴이 어색하다 (개별 import per icon)

- 번들 사이즈가 Lucide · Tabler에 비해 무겁다

- Pro 라이선스가 가격이 있다 ($99/year individual, $399/year team)

9장 · Material Symbols — Google variable font, Material Icons 대체

2022년 Google이 Material Icons를 **Material Symbols**로 리브랜딩하며 4축 variable font로 재출시했다.

9.1 4축 variable font

- **Weight** — 100 ~ 700

- **Fill** — 0 ~ 1 (outline → 채움)

- **Grade** — -25 ~ +200 (미세 두께)

- **Optical Size** — 20 ~ 48 (작은 사이즈에서 stroke를 두껍게)

한 폰트 파일로 수만 가지 모양이 가능하다.

9.2 두 가지 스타일

- **Material Symbols Outlined** — 라인 기본

- **Material Symbols Rounded** — 부드러운 모서리

- **Material Symbols Sharp** — 각진 모서리

9.3 CSS에서 쓰기

.material-symbols-outlined {

font-variation-settings:

'FILL' 0,

'wght' 400,

'GRAD' 0,

'opsz' 24;

}

.active .material-symbols-outlined {

font-variation-settings: 'FILL' 1, 'wght' 600;

}

9.4 React에서

`react-material-symbols` 패키지 또는 Iconify(`@iconify-icons/material-symbols`)를 통해 SVG로 부른다.

9.5 왜 Material Symbols인가

- **3000개 이상** — 디자인 시스템 부속이라 매우 넓은 커버리지

- **Google · Android와의 시각 일관성**

- **4축 variable font**로 토글 onActive를 fill 가변으로 표현 가능

- **Apache 2.0**

9.6 한계

- Material 3 디자인 언어가 호불호가 있다 (Material You의 다소 부드러운 미감)

- 변수 폰트 학습 곡선 (그러나 한번 익히면 강력)

10장 · BoxIcons / Bootstrap Icons / Octicons / Carbon Icons

10.1 BoxIcons

[boxicons.com](https://boxicons.com) — Atisa의 작품. 약 1600개, MIT.

세 가지 변형: Regular(outline) · Solid · Logos. 브랜드 로고가 강점이지만, 2024년 이후 업데이트가 느리다.

10.2 Bootstrap Icons

[icons.getbootstrap.com](https://icons.getbootstrap.com) — Bootstrap 팀 공식. 약 2000개, MIT.

Bootstrap CSS와 한 쌍. 부트스트랩 사용자라면 자연스러운 선택. 두께가 1.5px의 단단한 stroke 스타일.

10.3 Octicons

[GitHub](https://primer.style/octicons) — GitHub의 Primer Design System 부속. 약 250개.

GitHub.com 사이트와 같은 시각. PR · Issue · Branch 같은 GitHub 도메인 아이콘이 강점. GitHub clone 사이트를 만든다면 거의 필수.

10.4 Carbon Icons

[Carbon Design System](https://carbondesignsystem.com/elements/icons/library/) — IBM 공식. 약 2200개.

엔터프라이즈 SaaS 시각 언어. IBM Cloud · Watson 같은 도메인 아이콘이 강점. 시각이 무겁고 진중해서 B2B SaaS에 잘 어울린다.

10.5 비교 요약

| 라이브러리 | 개수 | 강점 | 약점 |

|---|---|---|---|

| BoxIcons | 1600 | 브랜드 로고 | 업데이트 느림 |

| Bootstrap | 2000 | BS 일관성 | 폐쇄적 미감 |

| Octicons | 250 | GitHub 도메인 | 너무 좁음 |

| Carbon | 2200 | 엔터프라이즈 | 무거운 미감 |

11장 · Remix Icon / Eva Icons / Streamline — 무료 + paid

11.1 Remix Icon

[remixicon.com](https://remixicon.com) — 중국 디자이너 Jimmy Cheung. 약 3000개, Apache 2.0.

Outline + Fill 두 변형. 비교적 굵은 stroke 스타일. **중국어권에서 가장 인기 있는** OSS 아이콘.

11.2 Eva Icons

[Akveo](https://akveoeva.netlify.app) — Akveo 팀. 약 480개, MIT.

Nebular 디자인 시스템과 한 쌍. Outline + Fill 두 변형. 2020년 이후 업데이트가 거의 멈췄지만, 셋 자체는 여전히 완성도가 높다.

11.3 Streamline

[streamlinehq.com](https://www.streamlinehq.com) — 유료 100,000개 이상.

- 80,000개 이상의 아이콘 + 30,000개의 일러스트 + UI 패턴

- 4가지 스타일 (Light · Regular · Bold · Plump · Cute)

- Figma 플러그인 · Sketch · iOS · Android · React 패키지

- $109/year ~ $599/year

디자이너의 시간을 산다. 일러스트레이션이 필요한 마케팅 페이지 · 빈 상태 · 온보딩에 매우 강하다.

12장 · Iconjar — Mac 아이콘 매니저

[Iconjar](https://geticonjar.com)는 Mac 전용 데스크탑 앱. 아이콘 라이브러리를 OS 레벨에서 관리한다.

12.1 무엇을 하는가

- **아이콘 라이브러리 통합 검색** — Lucide · Phosphor · Tabler · FontAwesome 등 30+ 라이브러리를 한 검색창에서

- **드래그 앤 드롭** — Figma · Sketch · VS Code · Slack 어디든 끌어서 놓기

- **태그 시스템** — 자체 태그로 분류

- **SVG · PNG · ICNS · PDF Export**

- **자체 라이브러리 판매** — Iconjar 내장 라이브러리(80,000+)도 있음

12.2 가격

$39.99 한 번 결제 (영구 라이선스). 추가 라이브러리는 별도 결제.

12.3 누구에게 좋은가

- Mac을 쓰는 풀타임 디자이너 — 매일 아이콘을 찾는 사람

- 여러 프로젝트를 동시에 진행 — 프로젝트별로 라이브러리를 다르게 쓰는 사람

- Windows/Linux 사용자에게는 대안 부족 (대안: Nucleo, Iconpacks 등)

13장 · Iconify — 200K+ 아이콘 통합 API

[Iconify](https://iconify.design)는 모든 아이콘 라이브러리를 단일 API로 묶는 메타 도구. 2026년 현재 200개 이상의 아이콘 셋과 250,000개 이상의 아이콘이 등록되어 있다.

13.1 핵심 아이디어

> 아이콘 라이브러리를 매번 npm install 하지 말고, 하나의 컴포넌트로 모두 부르자.

13.2 동작 방식

- **온디맨드 다운로드** — 처음 사용 시 CDN에서 SVG 가져옴

- **자체 호스팅 가능** — `@iconify/json` 패키지로 로컬 빌드

- **Tree-shaking 친화** — `@iconify-icons/lucide` 같은 셋별 패키지로 import

13.3 React + 자체 호스팅

// 빌드 시 번들에 포함

13.4 Iconify의 강점

- **하나의 학습 곡선으로 모든 아이콘** — 디자이너가 Phosphor을 원해도, 개발자가 Tabler를 원해도, 같은 컴포넌트

- **Tailwind 플러그인** — `@iconify/tailwind`로 `bg-[mask-image]` CSS만으로 사용

- **VS Code 확장** — 에디터에서 직접 아이콘 미리보기

- **Figma 플러그인** — Figma에서 동일한 라이브러리 그대로

13.5 한계

- 통합 추상이라 셋별 최적화는 부족할 수 있음 (특히 Phosphor의 weight prop은 별도 처리)

- 동적 import 의존성 — 첫 렌더에서 약간의 지연

14장 · 한국 — 토스 디자인 시스템, 카카오 디자인

14.1 토스 디자인 시스템 아이콘

[토스](https://toss.im)는 한국 핀테크의 디자인 시스템 표준이다. 토스의 아이콘 셋은 공개 패키지로 배포되지 않지만, **TDS(Toss Design System)** 내부 시스템에서 일관된 두께 · 모서리 · 그리드를 유지한다.

특징:

- **24×24 그리드**

- **2px stroke** 기본

- **둥근 모서리** — Toss의 시그니처

- **금융 도메인 아이콘** — 송금 · 카드 · 적금 등이 풍부

토스의 디자인은 공개되어 있지 않지만, 토스의 미감을 따라 만든 한국 핀테크 사이트가 매우 많다. 라이센스 없이 따라 그릴 일은 없어야 하지만, 영향력은 압도적이다.

14.2 카카오 디자인 시스템

[카카오 디자인 시스템](https://www.kakaocorp.com/page/service/design)도 자체 아이콘 셋을 운영한다. 비공개. 카카오톡 · 카카오맵 · 카카오페이가 모두 같은 시각 언어를 공유한다.

14.3 NAVER 디자인

NAVER도 자체 디자인 시스템(Nuxt Design System 등)을 운영하지만 외부 공개는 제한적. LINE 디자인 시스템(LINE Design System)은 일부 공개되어 있다.

14.4 한국 개발자가 실무에서 쓸 때

- **공공 도메인 (정부24, 토스를 모방하지 않은 자체 사이트)**: Lucide · Phosphor · Tabler가 안전한 기본

- **핀테크 SaaS**: 토스 스타일을 직접 모방하지 말고, Heroicons solid + 자체 둥근 모서리 컨벤션을 만드는 게 안전

- **메신저 · 커뮤니티**: 카카오 UX를 따라가야 한다면 Phosphor Bold · Fill 변형이 가장 가까운 미감

15장 · 일본 — NAVITIME pictograms, JR · 공공 아이콘 표준

15.1 JIS Z 8210 — 일본 공공 픽토그램 표준

JIS Z 8210은 일본 산업 표준이 정한 **공공 픽토그램**이다. 화장실 · 출구 · 엘리베이터 · 응급 처치 같은 공공 사인이 이 표준을 따른다. 2017년 도쿄 올림픽을 앞두고 국제 표준(ISO 7001)에 가깝게 업데이트됐다.

15.2 NAVITIME pictograms

NAVITIME은 일본의 대표 지도 · 환승 앱이다. 자체 픽토그램 셋을 운영하며, 일부는 공개되어 있다. 일본 대중교통(JR · 메트로 · 버스)의 라인 컬러 + 픽토그램이 통합되어 있다.

15.3 JR 사이니지

JR(Japan Railway)의 역 사이니지는 일본 그래픽 디자인의 정통이다. 시계 · 환승 · 출구 안내가 모두 한 시각 언어로 묶여 있다. 외부 라이브러리로 제공되지 않지만, 일본 사이트를 만든다면 영향을 의식해야 한다.

15.4 일본 개발자가 실무에서 쓸 때

- **공공 사이트**: Material Symbols Rounded + JIS Z 8210 픽토그램 (자체 SVG)

- **여행 · 교통 SaaS**: Phosphor Regular + Duotone 조합 (NAVITIME 미감에 가까움)

- **만화 · 게임 풍**: Phosphor Bold · Fill + Tabler의 게임 도메인 아이콘

16장 · 누가 무엇을 골라야 하나 — 시나리오별 권장

16.1 사이드 프로젝트 · 빠른 프로토타입

**선택: Lucide**

- 1500개로 충분

- Feather 정통 미감

- Tree-shaking이 가장 깔끔

16.2 디자인 시스템을 구축하는 스타트업

**선택: Phosphor**

- 6 weight 시스템이 디자인 시스템의 토큰화에 잘 맞는다

- Toggle · 활성 상태 표현이 자연스럽다

- 5400개로 도메인 커버리지 충분

16.3 Tailwind UI · Tailwind 풀스택 환경

**선택: Heroicons + Lucide 보조**

- Heroicons로 시각 일관성

- 부족한 도메인은 Lucide로 보조

16.4 대용량 SaaS · 도메인 다양성 요구

**선택: Tabler + Iconify로 보조**

- 4900개로 거의 다 커버

- 부족한 부분은 Iconify로 Phosphor · Material Symbols 보조

16.5 엔터프라이즈 B2B SaaS

**선택: Carbon Icons + FontAwesome Pro**

- Carbon의 무거운 미감이 엔터프라이즈 톤

- FontAwesome Pro Brands로 통합 사이트 로고 표현

16.6 Google · Android 일관성

**선택: Material Symbols**

- Google · Android 사용자의 학습된 시각 언어

- 변수 폰트로 표현력 압도적

16.7 GitHub · 개발자 도구 클론

**선택: Octicons + Lucide**

- Octicons로 GitHub 도메인

- Lucide로 일반 UI

16.8 디자이너 풀타임 — Mac 사용

**선택: Iconjar + Streamline**

- Iconjar로 모든 라이브러리 통합 관리

- Streamline으로 일러스트 · 빈 상태

16.9 의사결정 매트릭스

| 우선순위 | 권장 라이브러리 |

|---|---|

| 미니멀 · 정통 | Lucide |

| 디자인 시스템 토큰화 | Phosphor |

| Tailwind 일관성 | Heroicons |

| 도메인 다양성 | Tabler |

| 변수 폰트 표현력 | Material Symbols |

| 엔터프라이즈 톤 | Carbon Icons |

| 통합 API | Iconify |

| 디자이너 도구 | Iconjar + Streamline |

| 상업 라이선스 + 브랜드 | FontAwesome Pro |

| Radix UI 사용자 | Radix Icons |

17장 · 라이선스 · 상업 사용 · 정리

17.1 라이선스 빠른 참조

| 라이브러리 | 라이선스 | 상업 사용 | 재배포 |

|---|---|---|---|

| Lucide | MIT | OK | OK |

| Heroicons | MIT | OK | OK |

| Phosphor | MIT | OK | OK |

| Iconoir | MIT | OK | OK |

| Tabler | MIT | OK | OK |

| Radix Icons | MIT | OK | OK |

| FontAwesome Free | CC BY 4.0 | OK | 출처 명시 |

| FontAwesome Pro | Commercial | 라이선스 구매 | 제한적 |

| Material Symbols | Apache 2.0 | OK | OK |

| BoxIcons | MIT | OK | OK |

| Bootstrap Icons | MIT | OK | OK |

| Octicons | MIT | OK | OK |

| Carbon Icons | Apache 2.0 | OK | OK |

| Remix Icon | Apache 2.0 | OK | OK |

| Eva Icons | MIT | OK | OK |

| Streamline | Commercial | 라이선스 구매 | 제한적 |

| Iconjar 자체 라이브러리 | Commercial | 라이선스 구매 | 제한적 |

17.2 출처 명시 의무

- **CC BY 4.0 (FontAwesome Free)**: 푸터나 about 페이지에 "Icons by Font Awesome" 명시

- **MIT/Apache**: 출처 명시 의무 없음 (다만 라이선스 파일 보관)

- **Pro 라이선스**: 라이선스 조건에 따라 다름. 보통 출처 명시 불요

17.3 한국 · 일본의 출처 표기 관행

- 한국 SaaS: "Icons: Lucide, Phosphor" 같은 푸터 표기 점차 일반화

- 일본 사이트: 공공 픽토그램은 JIS Z 8210 표준 인용

- 양쪽 모두 CC BY 4.0이라면 의무이고, MIT라면 호의

에필로그 — 아이콘은 디자인 토큰이다

2026년의 좋은 아이콘 라이브러리는 더 이상 "예쁜 그림 모음"이 아니다.

- **stroke width**가 디자인 토큰이고

- **fill 가변**이 인터랙션 상태이고

- **weight 6단계**가 강조 시스템의 척도이고

- **24px vs 20px vs 15px**는 정보 밀도의 결정이다

Lucide의 미니멀, Phosphor의 표현력, Tabler의 다양성, Material Symbols의 변수 폰트 4축, Iconify의 통합 — 각자 다른 답을 준다.

내가 만드는 제품의 정체성이 무엇이고, 그 정체성을 가장 잘 받쳐 줄 아이콘이 무엇인지. 이 글이 그 결정의 지도가 되었기를.

좋은 아이콘은 사용자에게 "이게 무엇이다"를 0.1초에 전달한다. 그 0.1초를 가볍게 보지 말자.

참고 / References

- Lucide: [https://lucide.dev](https://lucide.dev)

- Lucide GitHub: [https://github.com/lucide-icons/lucide](https://github.com/lucide-icons/lucide)

- Feather Icons: [https://feathericons.com](https://feathericons.com)

- Heroicons: [https://heroicons.com](https://heroicons.com)

- Heroicons GitHub: [https://github.com/tailwindlabs/heroicons](https://github.com/tailwindlabs/heroicons)

- Phosphor Icons: [https://phosphoricons.com](https://phosphoricons.com)

- Phosphor GitHub: [https://github.com/phosphor-icons](https://github.com/phosphor-icons)

- Iconoir: [https://iconoir.com](https://iconoir.com)

- Tabler Icons: [https://tabler.io/icons](https://tabler.io/icons)

- Tabler GitHub: [https://github.com/tabler/tabler-icons](https://github.com/tabler/tabler-icons)

- Radix Icons: [https://www.radix-ui.com/icons](https://www.radix-ui.com/icons)

- Radix UI: [https://www.radix-ui.com](https://www.radix-ui.com)

- FontAwesome: [https://fontawesome.com](https://fontawesome.com)

- Material Symbols: [https://fonts.google.com/icons](https://fonts.google.com/icons)

- BoxIcons: [https://boxicons.com](https://boxicons.com)

- Bootstrap Icons: [https://icons.getbootstrap.com](https://icons.getbootstrap.com)

- Octicons (Primer): [https://primer.style/octicons](https://primer.style/octicons)

- Carbon Design System Icons: [https://carbondesignsystem.com/elements/icons/library/](https://carbondesignsystem.com/elements/icons/library/)

- Remix Icon: [https://remixicon.com](https://remixicon.com)

- Eva Icons: [https://akveoeva.netlify.app](https://akveoeva.netlify.app)

- Streamline: [https://www.streamlinehq.com](https://www.streamlinehq.com)

- Iconjar: [https://geticonjar.com](https://geticonjar.com)

- Iconify: [https://iconify.design](https://iconify.design)

- Iconify React: [https://iconify.design/docs/icon-components/react/](https://iconify.design/docs/icon-components/react/)

- Iconify Tailwind plugin: [https://iconify.design/docs/usage/css/tailwind/](https://iconify.design/docs/usage/css/tailwind/)

- Toss Design: [https://toss.im](https://toss.im)

- Kakao Design: [https://www.kakaocorp.com/page/service/design](https://www.kakaocorp.com/page/service/design)

- LINE Design System: [https://designsystem.line.me](https://designsystem.line.me)

- JIS Z 8210 (Japanese pictogram standard): [https://www.jisc.go.jp](https://www.jisc.go.jp)

- Nerd Fonts: [https://www.nerdfonts.com](https://www.nerdfonts.com)