Reseed CLI: 모든 사이트에서 디자인 시스템을 추출하여 Claude Code와 Cursor로

Reseed는 실제 운영 중인 웹사이트(본인의 사이트, 참고 사이트, 또는 경쟁사 사이트)에서 실제 디자인 시스템을 추출하여 repo에 직접 넣어주는 CLI 도구입니다. 출력물에는 실제 색상, 간격, 글자 크기 체계, 모서리 둥글기가 포함된 tailwind.config.ts, 에이전트가 세션마다 읽을 수 있는 design-system.md, 그리고 모델이 시각적 사실을 확인할 수 있는 독립형 참조 HTML이 포함됩니다.

작동 방식

파이프라인은 전적으로 Claude Code와 일반 TypeScript로 실행됩니다. Opus 4.7이 소스 스크린샷에 대한 비전 분석을 수행합니다. 나머지 부분은 비용을 제한하고 실행 간 출력을 재현 가능하게 유지하기 위해 TypeScript로 작성되었습니다. 한 번 실행하고 커밋하면 해당 repo의 모든 향후 Claude Code 또는 Cursor 세션이 디자인 시스템을 따릅니다.

핵심 워크플로우 인사이트

제작자는 Claude가 계속해서 제네릭한 "AI 특유의" 요소(보라색 그라데이션, 글래스모피즘, 그림자 스택, 과도하게 큰 둥근 카드)를 기본값으로 사용한다는 것을 발견했습니다. 해결책은 더 많은 프롬프트가 아니라 에이전트에게 소스 디자인이 피하는 패턴의 명시적인 목록을 제공하는 것이었습니다. 이 한 가지 변경만으로 생성된 UI가 더 이상 AI가 만든 것처럼 보이지 않게 되었습니다.

사용 가능성

이 도구는 무료로 사용해볼 수 있으며, 무료 티어에서 3번의 추출이 가능하며 신용카드가 필요하지 않습니다. https://reseedapp.com에서 이용할 수 있습니다.