extract-design-system은(는) 무엇을 하나요?
모든 공개 웹사이트에서 디자인 토큰(색상, 타이포그래피, 간격, 테두리 반경, 그림자)을 추출합니다. 로컬 프로젝트를 위한 JSON 및 CSS 사용자 정의 속성을 생성합니다. AI 에이전트 스킬(Claude, Cursor, Codex) 및 독립형 CLI로 사용 가능합니다.
모든 공개 웹사이트에서 디자인 토큰(색상, 타이포그래피, 간격, 테두리 반경, 그림자)을 추출합니다. 로컬 프로젝트를 위한 JSON 및 CSS 사용자 정의 속성을 생성합니다. AI 에이전트 스킬(Claude, Cursor, Codex) 및 독립형 CLI로 사용 가능합니다.
이 스킬은 공개 웹사이트에서 디자인 시스템 토큰을 자동으로 추출하여 로컬 프로젝트에 바로 적용할 수 있는 JSON 및 CSS 사용자 정의 속성 파일로 변환합니다. 색상, 타이포그래피, 간격, 테두리 반경, 그림자 등 주요 디자인 토큰을 수집하며, Claude, Cursor, Codex와 같은 AI 에이전트 환경뿐만 아니라 독립형 CLI 도구로도 사용할 수 있습니다. 개발자는 이 스킬을 통해 타겟 웹사이트의 디자인 패턴을 분석하고 재사용 가능한 디자인 시스템을 신속하게 구축할 수 있어, 디자인 일관성을 유지하고 개발 속도를 향상시킵니다. 웹사이트 URL을 입력하면 자동으로 스타일시트와 계산된 스타일을 파싱하여 구조화된 토큰 데이터를 출력합니다.
npx skills add arvindrk/extract-design-system모든 공개 웹사이트에서 디자인 토큰(색상, 타이포그래피, 간격, 테두리 반경, 그림자)을 추출합니다. 로컬 프로젝트를 위한 JSON 및 CSS 사용자 정의 속성을 생성합니다. AI 에이전트 스킬(Claude, Cursor, Codex) 및 독립형 CLI로 사용 가능합니다.
This repo contains 1 individual skill — each has its own dedicated page.
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".