Design Extractor (디자인 추출기)은(는) 무엇을 하나요?
Claude Code용 AI 에이전트 스킬로, 코드베이스에서 디자인 시스템을 자동으로 추출합니다. 토큰, 컴포넌트, 프레임을 1:1 정확도로 재구성하는 단일 Figma 스크립트를 생성합니다.
Claude Code용 AI 에이전트 스킬로, 코드베이스에서 디자인 시스템을 자동으로 추출합니다. 토큰, 컴포넌트, 프레임을 1:1 정확도로 재구성하는 단일 Figma 스크립트를 생성합니다.
이 스킬은 Claude Code용 AI 에이전트 스킬로, 코드베이스에서 디자인 시스템을 자동으로 추출하여 완전히 실행 가능한 Figma 스크립트로 재구성합니다. 개발자가 프론트엔드 코드(HTML, CSS, JavaScript/TypeScript)를 분석하여 디자인 토큰(색상, 간격, 타이포그래피), 컴포넌트 구조, 프레임 레이아웃을 정확히 1:1로 Figma에서 재현할 수 있게 해줍니다. 이를 통해 디자인-개발 간 격차를 해소하고, 수작업으로 디자인 시스템을 문서화하거나 Figma에서 다시 만드는 번거로움을 없앱니다. 이 스킬은 특히 Claude Code 환경에서 사용되며, 단일 명령으로 전체 디자인 시스템을 추출하여 Figma 플러그인이나 API로 직접 붙여넣을 수 있는 스크립트를 생성합니다. 사용자는 '디자인 시스템 추출'과 같은 명령어로 실행할 수 있으며, 결과물은 컬러 토큰, 스페이싱, 타이포그래피, 버튼과 같은 재사용 가능한 컴포넌트, 그리고 주요 프레임 구조를 포함합니다. 이 스킬은 수작업을 대폭 줄이고 디자인 일관성을 유지하는 데 유용합니다.
npx skills add PatNoO/design-extractorClaude Code용 AI 에이전트 스킬로, 코드베이스에서 디자인 시스템을 자동으로 추출합니다. 토큰, 컴포넌트, 프레임을 1:1 정확도로 재구성하는 단일 Figma 스크립트를 생성합니다.
ElevenLabs text-to-speech with mac-style say UX.
Oracle CLI second-model review/debug/refactor/design with selected files, dry-run token checks, API or browser engine.
Capture and automate macOS UI with the Peekaboo CLI.
Generate multiple radically different interface designs for a module using parallel sub-agents. Use when user wants to design an API, explore interface options, compare module shapes, or mentions "design it twice".
Build a throwaway prototype to flesh out a design — a runnable terminal app for state/business-logic questions, or several radically different UI variations toggleable from one route.
Interview the user relentlessly about a plan or design until reaching shared understanding, resolving each branch of the decision tree. Use when user wants to stress-test a plan, get grilled on their design, or mentions "grill me".