오픈 소스 소스
Lucide 아이콘 세트(MIT 라이센스)에서 제공하는 아이콘입니다.
120 중 1904 아이콘 표시 중복사 작업
사본 이름은 lucide-react 가져오기용입니다. 복사 SVG는 원시 마크업입니다. 복사 React는 독립형 구성요소를 생성합니다.
오픈 소스 SVG 아이콘 세트
이 페이지에는 디자인 및 개발 워크플로를 위한 빠른 검색, 미리 보기 및 복사하기 쉬운 출력을 갖춘 전체 Lucide 아이콘 라이브러리가 나열되어 있습니다.
- lucide-react에서 직접 아이콘 이름 사용
- Figma 또는 HTML에 대한 원시 SVG 마크업을 가져옵니다.
- 종속성 없이 사용하려면 React 구성 요소를 복사하세요.
- 정리를 위해 SVG 편집기에서 즉시 아이콘 열기
SVG 아이콘 사용 예
React, HTML 및 디자인 작업 흐름에서 이 SVG 아이콘 라이브러리를 사용하는 일반적인 방법입니다.
Lucide-React와 함께 사용
이름으로 가져오고 아이콘을 React 구성 요소로 렌더링합니다.
"lucide-react"에서 { Activity }를 가져옵니다.
내보내기 함수 IconExample() {
return <Activity className="h-6 w-6" />;
}
HTML의 인라인 SVG
원시 SVG 마크업을 HTML 또는 디자인 도구에 직접 붙여넣습니다.
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" 스트로크="currentColor" 스트로크-폭="2" 스트로크-라인캡="라운드" 스트로크-라인조인="라운드">
<경로 d="M4 12h4l2-7 4 14 2-7h4" />
</svg>
독립형 React 구성요소
추가 종속성 없이 SVG를 재사용 가능한 React 구성 요소에 복사합니다.
내보내기 함수 ActivityIcon(props: React.SVGProps<SVGSVG요소>) {
return (
<svg {...props} width="24" height="24" viewBox="0 0 24 24" fill="none" 스트로크="currentColor" 스트로크폭="2">
<경로 d="M4 12h4l2-7 4 14 2-7h4" />
</svg>
);
}
