원클릭으로
design-system
Design tokens (OKLch), color palette, typography, UI patterns, accessibility (WCAG 2.2).
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
메뉴
Design tokens (OKLch), color palette, typography, UI patterns, accessibility (WCAG 2.2).
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Next.js 15 Pages Router frontend development. Feature-based + Container/Presenter pattern, MUI v7 + Emotion CSS-in-JS.
Build API client tests with Vitest and MockHandler. Validate OpenAPI contract compliance with table-driven tests and minimal mocks.
Next.js 15 + Cloudflare Workers + @vspo-lab/api client. Result-type error handling, OpenAPI-generated client, feature-based architecture.
PR/code review based on architecture rules. Detects violations of UseCase implementation rules, Result type, and JSDoc conventions.
Create a conventional commit. No Co-Authored-By trailer.
Update docs/domain alongside feature additions and spec changes, maintaining a history of specification decisions.
| name | Design System |
| description | Design tokens (OKLch), color palette, typography, UI patterns, accessibility (WCAG 2.2). |
docs/design/design-tokens.md - 3-layer token structure (Palette -> Semantic -> Component)docs/design/colors.md - Color palette and contrast ratio rulesdocs/design/typography.md - Font selection and text sizesdocs/design/design-patterns.md - UI patterns (layout, modal, wizard)docs/design/design-principles.md - Design principlesdocs/design/accessibility.md - WCAG 2.2 compliancedocs/design/icons.md - Iconsdocs/design/content-guidelines.md - Content guidelines