메뉴
Use for design-token work, CSS architecture, shared UI patterns, visual consistency, and responsive layout cleanup.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Create custom subagents for specialized AI tasks. Use when you want to create a new type of subagent, set up task-specific agents, configure code reviewers, debuggers, or domain-specific assistants with custom prompts.
Debugging specialist for errors, test failures, and unexpected behavior. Use when encountering reproducible bugs; follow reproduction steps and remove instrumentation before finishing.
Convert 'Applied intelligently' Cursor rules (.cursor/rules/*.mdc) and slash commands (.cursor/commands/*.md) to Agent Skills format (.cursor/skills/). Use when you want to migrate rules or commands to skills, convert .mdc rules to SKILL.md format, or consolidate commands into the skills directory.
Adversarial multi-model code review — launch parallel readonly reviewers on different models, then synthesize consensus vs lone findings. Do not apply fixes unless the user asks.
Reproduce reported bugs before fixing. Provide evidence of reproduction and the fix; do not stop after repro to ask the user—continue to fix.
Guide users building apps, scripts, CI pipelines, or automations on top of the Cursor SDK - TypeScript (@cursor/sdk) or Python (cursor-sdk / cursor_sdk). Use when integrating Cursor agents programmatically; Agent.create, Agent.prompt, streaming, local vs cloud runtime, MCP, errors.
| name | frontend-design-system |
| description | Use for design-token work, CSS architecture, shared UI patterns, visual consistency, and responsive layout cleanup. |
| when_to_use | ["Consolidating duplicated card / button / panel variants","Adding a new design token","Auditing CSS for off-token values","Building a new reusable component"] |
| related_files | ["styles/global.css","styles/pages/**","docs/DESIGN_TOKENS.md","docs/PERFORMANCE.md"] |
| related_prompts | [".github/prompts/mobile-ux-audit.prompt.md",".github/prompts/tracker-flagship-revamp.prompt.md"] |
Keeps Gold Ticker Live's UI coherent. Consolidate before you create.
styles/global.css)| Category | Prefix |
|---|---|
| Color | --color-* |
| Surface | --surface-* |
| Text | --text-* |
| Space | --space-* |
| Radius | --radius-* |
| Shadow | --shadow-* |
| Easing | --ease-* |
| Duration | --duration-* |
When you find yourself reaching for a hex / raw rem / arbitrary cubic-bezier, stop — check whether a token already covers it. If not, add the token (with rationale in a comment) and use it.
docs/DESIGN_TOKENS.md.checklists/tokens.mdchecklists/components.mdchecklists/responsive-layout.mdchecklists/accessibility.md.card variant instead of a token-driven size prop.style="..." for "just this one place".--z-* (or a documented stacking order).prefers-reduced-motion.