사용 가이드로 건너뛰기
Better Icons작성자 better-auth

Better Icons 스킬.

기존 아이콘을 찾고 검증한 라이브러리 ID로 SVG를 가져오세요.

  • 아이콘 검색
  • SVG
소스 검토 · better-iconsSKILL.md
작업 기존 아이콘을 찾고 검증한 라이브러리 ID로 SVG를 가져오세요. 결과물 요청한 개념에 맞춘 구체적인 아이콘 ID 후보 목록. 시작 전 확인 라이브러리의 기존 파일을 가져오는 워크플로이며, 독창적인 로고 디자인 과정을 설명하지는 않습니다.
편집 요약 · 소스 검토일 2026-11-02 · 생성된 예제가 아닙니다

01 기능 소개

기존 아이콘을 찾고 검증한 라이브러리 ID로 SVG를 가져오세요

Iconify 컬렉션을 검색하고 스타일을 비교한 뒤 Better Icons CLI 또는 MCP 도구로 SVG 파일을 가져오세요.

소스 기반 워크플로실행 벤치마크 아님

작업 방식

Better Icons는 에이전트가 Iconify 컬렉션에서 아이콘을 찾고 가져오는 구체적인 방법을 제공합니다. 컬렉션 접두사로 검색 범위를 좁힐 수 있고 각 결과에는 lucide:home 같은 명확한 식별자가 있습니다. 크기와 색상을 지정한 SVG 가져오기를 지원해 모호한 아이콘 요청을 추적 가능한 파일 선택으로 바꿀 수 있습니다.

같은 기능을 명령줄 작업과 MCP 도구로 사용할 수 있습니다. MCP에는 컬렉션 탐색, 유사 아이콘 검색, 추천, 프로젝트 스캔, 동기화가 포함됩니다. 아이콘이 일관된 계열을 따르도록 인터페이스를 만들거나 정리할 때 유용합니다.

예상 산출물

  • 요청한 개념에 맞춘 구체적인 아이콘 ID 후보 목록.
  • 요청한 크기와 색상으로 가져온 SVG 파일.
  • 선택한 지원 워크플로를 통한 아이콘 매핑 또는 프로젝트 연동.
예시 브리프 보기

브리프에서 검토까지

  1. 01
    아이콘 계열 정하기

    기존 아이콘을 살펴보고 표현해야 할 개념을 정합니다. 디자인에 일관된 시각 언어가 이미 있다면 컬렉션 접두사를 선택합니다.

  2. 02
    검색하고 비교하기

    의미를 기준으로 검색하고 반환된 ID를 확인합니다. MCP 도구는 컬렉션 탐색, 용도별 추천, 여러 라이브러리의 유사한 기호 찾기도 지원합니다.

  3. 03
    선택한 파일 가져오기

    prefix:name 식별자로 SVG를 가져옵니다. 크기와 색상을 의도적으로 정하고 선택한 아이콘만 지정한 프로젝트 위치에 저장하거나 동기화합니다.

02 활용 상황

언제 사용하면 좋을까요

라이브러리의 기존 파일을 가져오는 워크플로이며, 독창적인 로고 디자인 과정을 설명하지는 않습니다.

적합한 경우

  • 인터페이스 아이콘 선택선택한 기존 컬렉션에 맞는 탐색, 동작, 상태 아이콘을 찾습니다.
  • 아이콘 일관성 정리프로젝트의 아이콘 사용을 살펴보고 기록된 매핑을 통해 어울리지 않는 아이콘을 교체합니다.

확인할 한계

  • 기존 그래픽 활용라이브러리의 기존 파일을 가져오는 워크플로이며, 독창적인 로고 디자인 과정을 설명하지는 않습니다.
  • 도구 사용 가능 여부CLI 또는 MCP 연동을 사용할 수 있어야 하며, 가져오기에는 Iconify API를 사용합니다.

준비할 입력

  • 표현할 개념아이콘으로 표현할 동작, 이동 대상 또는 상태를 제공하세요.
  • 컬렉션 선호접두사를 지정하거나 윤곽선, 채움, 스타일 제한 없음 중 선호를 알려주세요.
  • 출력 요건저장 위치, 크기, 색상, 지원되는 연동 프레임워크를 지정하세요.

03 핵심 결정

중요한 판단 기준

  1. 추적 가능한 선택

    선택한 각 파일에는 구체적인 prefix:name ID가 있습니다.

  2. 일관된 가져오기

    파일을 가져올 때 색상과 크기를 지정할 수 있습니다.

  3. 에이전트 연동

    MCP 도구는 검색, 일괄 가져오기, 프로젝트 아이콘 스캔을 지원합니다.

04 예시 브리프

목적을 좁힌 요청으로 시작하세요

아래 예시 브리프는 테스트되지 않았습니다. 사용하기 전에 스킬의 설정을 확인하세요.

소스와 설정 확인

아이콘으로 표현할 동작, 이동 대상 또는 상태를 제공하세요.

업스트림 소스 파일
https://github.com/better-auth/better-icons/blob/033316ecb8f4982235af4111a2257e80231f5ab1/skills/SKILL.md

아래 참고 링크에서 원본 사용 지침을 확인할 수 있습니다. 사용 전에 리포지터리의 설정 요건을 확인하세요. 설치 명령어가 아닙니다.

결과물 하나부터 시작

스킬을 실행하기 전에 이 브리프의 범위, 소스 자료, 제약 조건을 상황에 맞게 조정하세요.

예시 브리프
better-icons로 프로젝트 탐색 메뉴의 개요, 활동, 구성원, 결제, 설정 아이콘을 선택해주세요. 검색 전에 리포지터리에서 이미 사용 중인 아이콘 계열을 확인하세요. 해당 컬렉션에서 어울리는 윤곽선 아이콘을 우선 선택하고 각 항목의 정확한 prefix:name ID를 반환하세요. 선택한 SVG를 24픽셀, currentColor로 가져와 지정한 파일 디렉터리에 저장하세요. 탐색 라벨과 아이콘 ID의 매핑을 남기세요. 이번에는 다른 아이콘을 바꾸거나 애플리케이션 전체에 새로운 아이콘 시스템을 설치하지 마세요.

결과 확인

실제 출력을 다음의 관찰 가능한 기준과 비교해 확인하세요.

  • 선택한 모든 ID가 예상한 SVG로 연결됩니다.
  • 아이콘 모음의 시각적 스타일, 크기, 색상 처리 방식이 일관됩니다.
  • 합의한 파일과 연동 파일만 변경되었습니다.

OpenDesign은 코딩 에이전트를 위한 로컬 디자인 작업 공간을 제공합니다. 이 목록은 스킬이 번들로 포함되어 있거나 외부 도구, 자격 증명, 소프트웨어 의존성이 포함되어 있다는 뜻이 아닙니다.

05 출처 및 라이선스

소스와 라이선스

이 페이지는 아래에 링크된 고정 소스 리비전을 설명합니다. 업스트림의 동작과 요구 사항은 바뀔 수 있습니다.

소스 소유자
better-auth
스킬 파일
SKILL.md
라이선스
MIT
검토한 스냅샷
2026-11-02 · 033316ecb8f4

읽기 참고

  1. 라이선스 범위고정된 리비전의 리포지터리 LICENSE 본문을 확인했습니다. 아카이브의 전체 파일 이름 목록에서 이 스킬 경로 아래에 더 구체적으로 적용되는 LICENSE/COPYING/NOTICE 파일은 발견되지 않았습니다. 이 분류는 검토한 원본 소스에 대한 것이며, 생성 결과나 타사 의존성에는 해당하지 않습니다. 가져온 아이콘 컬렉션은 자체 라이선스가 있을 수 있습니다. 이 리포지터리의 MIT 선언만으로 Iconify가 반환하는 모든 아이콘의 라이선스가 정해지는 것은 아닙니다.
편집 소스 요약
기존 아이콘을 찾고 검증한 라이브러리 ID로 SVG를 가져오세요.

링크된 소스를 바탕으로 OpenDesign이 작성한 원본 요약입니다. 저장소 스타 수는 특정 시점의 인기 지표일 뿐 스킬 사용량이나 품질 점수가 아닙니다.

06 시작 전 질문

시작 전 궁금한 점

아이콘은 어떻게 식별하나요?

형식은 prefix:name이며 컬렉션 식별자와 아이콘 이름을 결합합니다.

여러 아이콘을 가져올 수 있나요?

네. CLI는 검색 결과를 SVG로 다운로드할 수 있고, 문서화된 MCP get_icons 작업은 요청당 최대 20개 아이콘 ID를 받습니다. 넓은 검색으로 원하지 않는 파일을 추가하지 않도록 일괄 가져오기 전에 ID를 선택하고 확인하세요.

MCP가 필수인가요?

아니요. 소스에는 npm 또는 Bun 실행 옵션을 사용하는 명령줄 검색과 가져오기도 설명되어 있습니다.

OpenDesign

작업 요청과 디자인 결과물을 한곳에 모으세요.

브리프, 소스 자료, 디자인 작업을 로컬 작업 공간에 함께 보관하세요. 워크플로에 추가하기 전에 스킬 자체의 설정을 확인하세요.

업스트림 소스 파일
https://github.com/better-auth/better-icons/blob/033316ecb8f4982235af4111a2257e80231f5ab1/skills/SKILL.md