MCP 서버와 에이전트 skill

MCP. 서버는 로컬에서 stdio로 실행되며 workflow, tree, find, search, usages, diff, inspect, nodes, variables, bundle, verify, index, jobs, changes, watch, export, export_batch, compare_image, models를 제공합니다. export_batch는 한 번의 호출로 최대 64개 파일을 쓰고 인라인 이미지 대신 매니페스트를 반환합니다. 절대 경로를 전달하세요. --root /path/to/designs(반복 가능)를 추가하면 모든 파일과 출력 경로를 선택한 폴더로 제한합니다. 사용자 지정 저장소를 명시적으로 요청하려면 --storage-root DIR(반복 가능)이 필요합니다. 기억된 workspace 위치는 이 옵션 없이 재사용합니다. 시작 인수와 여러 루트 설정 예를 참고하세요. 래스터 내보내기는 maxSize(기본 1600px)에 맞게 축소되어 인라인 이미지가 작게 유지되며, SVG는 메타데이터만 반환합니다.

agent는 workflow로 build, audit, images, search, plan, planning-details 또는 명시적으로 요청된 경우 yolo 가이드를 읽을 수 있습니다. portable skill과 같은 소스를 사용하므로 MCP 사용 시 별도 skill 설치는 선택 사항입니다. 실제 작업은 agent의 프로젝트·브라우저 도구와 호스트 권한으로 수행합니다. 가이드를 읽는 것만으로 작업이 실행되지는 않으며, 활용 방식은 클라이언트 지원과 모델 동작에 따라 달라집니다.

Claude Code를 네이티브 Windows에서 사용한다면 stdio 설정 안내와 npx용 cmd /c 래퍼를 따르세요.

Skill. figlens skill은 에이전트가 frame을 찾고, bundle을 작게 나누어 읽고, 범위가 정해진 작업을 계획하고, 실행 중인 UI를 디자인과 대조해 검증하도록 안내합니다. 지침만 설치하므로 CLI 또는 MCP 서버를 사용할 수 있어야 합니다. Skills CLI로 설치하거나 skills/figlens/를 에이전트의 skills 디렉터리(Claude Code는 ~/.claude/skills/)에 복사하세요.

npm install -g @runkids/figlens
npx skills add runkids/figlens --skill figlens

플러그인. Claude Code, Codex, Antigravity, Cursor, Kimi Code에서는 skill과 MCP 서버를 하나의 플러그인으로 함께 설치할 수 있습니다. 플러그인 설정을 참고하세요.

skillshare. skillshare로 Claude Code, Codex, Cursor 전반의 skill과 MCP 연결을 한곳에서 관리하세요.

skillshare install github.com/runkids/figlens/skills/figlens
skillshare mcp add figlens --global --target claude --target codex --target cursor --no-tui -- npx -y @runkids/figlens mcp
skillshare sync && skillshare sync mcp --global

설치 참고. npm 런처는 처음 사용할 때 해당 네이티브 바이너리를 내려받고, 릴리스의 SHA-256 체크섬으로 검증한 뒤 캐시합니다. 스크립트로 설치했다면 figlens update, Homebrew로 설치했다면 brew upgrade figlens로 업데이트하세요. 바이너리는 macOS(Apple silicon, Intel), Linux(arm64, x86_64, 정적 musl), Windows(x86_64)를 지원합니다.모든 설치 방법은 선택형 시맨틱 검색의 런타임인 figlens-embed도 figlens 옆에 둡니다. 모델을 설정하기 전에는 모델을 불러오지 않습니다.