Design
Plugin
seed-design
SEED는 당근 제품을 위한 통합된 디자인 언어입니다. 하나의 토큰 소스에서 React, iOS, Android, Lynx까지 여러 플랫폼에 일관된 디자인을 전달하고, Figma와 연동됩니다.
Plugin Signal71/100Solid
maintained100
capable67
documented30
adopted65
Install
$ npx -y skills add daangn/seed-design --agent claude-code
Stats
1,165
Stars
95
Forks
Active
Maintenance
TypeScript
Language
Apache-2.0
License
35m ago
Last commit
5y ago
Created
2m ago
Added
Repo: daangn/seed-design
What's inside
Skill(11 skills)
/chromatic-diffChromatic snapshot 변경의 원인, 실제 회귀 또는 flaky 여부를 조사할 때 사용한다./seed-changeSEED 변경의 영향·검증·기준 브랜치를 판단하거나, 공개 패키지 changeset을 작성하거나, 명시적으로 요청받은 rebase·commit·push·PR 제출을 할 때 사용한다./seed-componentSEED 컴포넌트의 경로 조회·React·Lynx API 비교, 신규·포팅·기존 구현 변경, React·Lynx 문서·예제 작성, 또는 컴포넌트와 무관한 색상 토큰의 지도·WCAG 대비 조사를 할 때 사용한다.
Command(6 commands)
Agent(4 agents)
README
SEED Design System
SEED는 당근 제품을 위한 통합된 디자인 언어입니다. 하나의 토큰 소스에서 React, iOS, Android, Lynx까지 여러 플랫폼에 일관된 디자인을 전달하고, Figma와 연동됩니다.
패키지
Definitions — 토큰·레시피 소스
- @seed-design/rootage-artifacts — 디자인 토큰·컴포넌트 스키마 정의
- @seed-design/qvism-preset — 스타일 레시피 정의
Base Libraries — 스타일 생성물
- @seed-design/css — 디자인 토큰·컴포넌트 스타일·테마 CSS
React
- @seed-design/react — 스타일드 React 컴포넌트
- @seed-design/react-headless — Headless UI 로직
- @seed-design/stackflow — Stackflow 통합
Lynx
- @seed-design/lynx-react — Lynx 컴포넌트
- @seed-design/lynx-css — Lynx용 CSS
- @seed-design/lynx-qvism-preset — Lynx용 스타일 레시피
Framework Plugins — 번들러·Tailwind 연동
- @seed-design/vite-plugin — Vite에 SEED 테마 적용
- @seed-design/webpack-plugin — Webpack·Rspack에 SEED 테마 적용
- @seed-design/rsbuild-plugin — Rsbuild에 SEED 테마 적용
- @seed-design/tailwind3-plugin — Tailwind 3에서 SEED 토큰 사용
- @seed-design/tailwind4-theme — Tailwind 4에서 SEED 토큰 사용
CLI & Migration
- @seed-design/cli — 컴포넌트를 프로젝트에 추가하는 CLI
- @seed-design/codemod — 코드 마이그레이션 도구
Integrations
- @seed-design/figma — Figma 연동
- @seed-design/mcp — MCP 서버
- @seed-design/docs-mcp — 문서 MCP 서버
Ecosystem — 파이프라인 엔진
- rootage — 토큰 빌드 엔진 (core·cli)
- qvism — 스타일 레시피 엔진 (core·cli)
- figma-extractor — Figma 변수 추출
- postcss-engaged · postcss-responsive — PostCSS 플러그인
Documentation
License
File tree
Showing a partial view of a very large repo.
FAQ
seed-design is a Claude Code plugin with 11 hand-picked skills for design work, indexed on Flowy. Install it with the command on its page. It includes chromatic-diff, seed-change, seed-component. Its skills do not fire on their own yet. Request auto-invocation to have Flowy route them as you prompt. Free and open source.
- What is seed-design?
- SEED는 당근 제품을 위한 통합된 디자인 언어입니다. 하나의 토큰 소스에서 React, iOS, Android, Lynx까지 여러 플랫폼에 일관된 디자인을 전달하고, Figma와 연동됩니다.
- How do I install seed-design?
- Run these in Claude Code: npx -y skills add daangn/seed-design --agent claude-code. Then prompt normally.
- Does seed-design auto-invoke its skills?
- Not yet. It is indexed on Flowy as a plain plugin. Request auto-invocation on its page and Flowy will route its skills for you as you prompt.
- Is seed-design free?
- Yes. Flowy is free and open source, with nothing gated. You can read every skill in full before you install.
Is this plugin yours?
Claim it with GitHubSubmit a pluginPromote it