메뉴
Use when needing Resend design resources. Routes to brand guidelines, visual identity, UI components, design tokens, and marketing page patterns.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
| name | resend-design-skills |
| description | Use when needing Resend design resources. Routes to brand guidelines, visual identity, UI components, design tokens, and marketing page patterns. |
| metadata | {"author":"resend","version":"1.0.2"} |
A collection of design-related skills for Claude Code.
| Skill | Use for | Path |
|---|---|---|
resend-brand | Brand colors, typography, logos, and visual identity — marketing materials, social graphics, presentations, and any external-facing content | brand-guidelines/SKILL.md |
resend-design-system | Product UI in the Resend codebase — src/ui/ component APIs, design tokens, code patterns, and UX heuristics (dialog vs stepper, disable vs hide, error surfaces, etc.) | design-system/SKILL.md |
marketing-pages | Creating, updating, or deleting marketing pages in src/app/(website)/ — page structure, public primitives, SEO metadata | marketing-pages/SKILL.md |
design-audit | "Audit design", "design alignment", "dashboard design audit", or the scheduled Monday routine — checks the dashboard for design system violations | design-audit/SKILL.md |
Each skill is a folder with a SKILL.md (frontmatter + guidelines) and optional references/.
design-skills/
├── SKILL.md # This index file
├── brand-guidelines/
│ └── SKILL.md # Resend brand skill
├── design-system/
│ ├── SKILL.md # Resend design system skill
│ └── references/
│ ├── components.md
│ ├── design-tokens.md
│ ├── component-conventions.md # CVA/compound-component code conventions
│ ├── patterns/
│ │ └── README.md # Documented UI composition patterns (concept, not code conventions above)
│ ├── heuristics.md # Index of Resend UX heuristics
│ └── heuristics/ # One file per heuristic (dialog vs stepper, etc.)
├── design-audit/
│ ├── SKILL.md # Design audit skill
│ └── references/
│ ├── rubric.md # Index of rubric/ + merged rule/pattern/heuristic table
│ ├── rubric/ # One file per audit category
│ ├── report-format.md
│ └── linear-delivery.md
├── marketing-pages/
│ ├── SKILL.md # Marketing pages skill
│ └── references/
│ └── components.md
└── tests/
└── TESTS.md # Combined test suite
Use when creating Resend marketing materials, documents, presentations, or visual content. Triggers for Resend brand, Resend style, or Resend visual identity requests.
Audit the Resend dashboard for design system alignment. Routes here when a user says "audit design", "design alignment", "dashboard design audit", asks about undocumented components or design violations, or when triggered by the scheduled weekly routine.
Use when building or modifying UI in the Resend codebase. Provides component APIs, variant options, design tokens, composition patterns for all src/ui/ primitives, and the Resend heuristics for UX decisions like dialog-vs-stepper or disable-vs-hide.
Use when creating, updating, editing, or deleting marketing/public pages in the Resend codebase. Covers page structure, component reuse rules, and the distinction between public and product design systems.