oblador/react-native-vector-icons

React Native 앱에 다양한 벡터 아이콘을 쉽게 통합하는 라이브러리

개발 재료맘대로 써도 됨 · MIT디자인·UI 컴포넌트난이도
17,883+0이번 주2,10110TypeScript
데모·홈페이지 열기oblador.github.io
중간맛 분석

TypeScript 기반이며 패키지-단위 아이콘 세트 구조로 개선되었습니다(v11 기준). FontAwesome 7.2.0(2,806개 아이콘), MaterialDesignIcons 7.4.47(7,448개), Ionicons 8.0.9(1,357개) 등을 지원하며, 동적 로딩(/root import) 또는 정적 임베드(/static import) 선택 가능합니다. Expo와 React Native CLI 모두 지원하며, 애니메이션(Animated API) 및 PNG 이미지 변환(getImageSource) 기능도 내장되어 있습니다. 즉시 사용 가능한 공식 예제가 준비되어 있습니다.

이런 레포예요

이럴 때 쓰면 좋아요

  • 네비게이션 탭바에 플랫폼별 아이콘 표시하기
  • 버튼과 입력 필드에 인라인 아이콘 추가하기
  • 여러 아이콘 세트를 조합해 앱 디자인 일관성 유지하기

핵심 기능

8개 이상의 공식 아이콘 세트(FontAwesome, Ionicons, Material Design Icons 등)아이콘을 PNG 이미지로 동적 변환(getImageSource)React Native Animated API 호환성

대안 대비 차별점

패키지-단위 아이콘 세트 구조와 동적/정적 로딩 옵션으로 번들 크기 최적화와 유연한 로딩 전략을 동시에 제공합니다.

준비물
  • React Native 프로젝트
  • Expo 또는 React Native CLI
바로 시작하기
  1. 원하는 아이콘 패키지 설치
npm install @react-native-vector-icons/fontawesome-free-solid @react-native-vector-icons/ionicons

  1. iOS/Android 또는 Expo에 맞는 세팅 가이드를 따라 진행 (docs/SETUP-EXPO.md, docs/SETUP-REACT-NATIVE.md, docs/SETUP-WEB.md 참고)

  2. 컴포넌트에서 아이콘 import

import { FontAwesomeFreeSolid } from "@react-native-vector-icons/fontawesome-free-solid/static";
  1. JSX에서 아이콘 사용
<FontAwesomeFreeSolid name="rocket" size={30} color="#900" />
별 추이 · 7일
17,883+0 / 7일
활용성 · 따라 만들기 좋은가
샘플 점수 34/100
  • 관대한 라이선스
  • 테스트 있음
  • 예제 디렉토리
  • 최근 활동
  • AGENTS.md
  • llms.txt
  • 템플릿

🟢 최근 활동 있음 · 2015년 생성

AI가 README 기반으로 요약했습니다 · 원문 보기