개발에 필요한, 작은 도구들.

아이콘 라이브러리

두 스타일을 비교하고 SVG를 복사하거나 다운로드하세요.

사용 가이드

입력은 이 브라우저에서 처리됩니다.

검색 · SVG 설정

Lucide·Tabler 전체 아이콘, 한 번에 최대 120개 표시

사용 예제 코드 보기 ↓

아이콘 미리보기

입력 후 실행하면 결과가 표시됩니다.

사용 예제 코드

개발에 가져다 쓸 수 있는 기본 예제입니다. 표시된 환경에서 실행하세요.

Node.js 22+ · ES module (.mjs)

현재 입력 반영은 코드에 사용된 항목에만 적용됩니다. 파일 입력은 예제에 포함하지 않습니다.

필요한 패키지 설치

npm install @iconify-json/lucide @iconify/utils
import { icons } from "@iconify-json/lucide";
import { getIconData, iconToSVG, iconToHTML } from "@iconify/utils";
const icon = getIconData(icons, "search");
if (!icon) throw new Error("Icon not found");
const result = iconToSVG(icon, { height: 24 });
console.log(iconToHTML(result.body, result.attributes));
console.log(icons.license); // Preserve the icon collection's license on distribution.

이렇게 사용하세요

search 또는 검색으로 아이콘을 찾고 Lucide와 Tabler의 선 표현을 비교하세요.

알아두면 좋은 점

형식과 의미

Lucide는 ISC, Tabler는 MIT 라이선스입니다. 사용·수정·재배포 시 해당 라이선스 고지를 포함하세요.

올바른 사용

아이콘 이름·한국어 키워드로 검색합니다. 목록은 로컬 정적 파일에서 불러옵니다.

지원 범위와 제한

Lucide·Tabler 전체 아이콘, 한 번에 최대 120개 표시

입력이 제한을 넘으면 데이터를 나누어 처리하세요. 파일 형식이나 알고리즘이 지원 범위에 없으면 다른 형식으로 임의 변환하지 말고 요구 사항에 맞는 도구를 선택하세요.