Menu
Design tokens (OKLch), color palette, typography, UI patterns, accessibility (WCAG 2.2).
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
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