design-guide
Paperclip UI design system guide for building consistent, reusable frontend components. Use when creating new UI components, modifying existing ones, adding pages or features to the frontend, styling UI elements, or when you need to understand the design language and conventions. Covers: component creation, design tokens, typography, status/priority systems, composition patterns, and the /design-guide showcase page. Always use this skill alongside the frontend-design skill (for visual quality) and the web-design-guidelines skill (for web best practices).
· 实时索引
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
想先保存到本地？可下载 RuleHub 当前索引到的 GitHub 仓库压缩包。
下载 Zip| name | design-guide |
| description | Paperclip UI design system guide for building consistent, reusable frontend components. Use when creating new UI compone... |
design-guide
Paperclip UI design system guide for building consistent, reusable frontend components. Use when creating new UI components, modifying existing ones, adding pages or features to the frontend, styling UI elements, or when you need to understand the design language and conventions. Covers: component creation, design tokens, typography, status/priority systems, composition patterns, and the /design-guide showcase page. Always use this skill alongside the frontend-design skill (for visual quality) and the web-design-guidelines skill (for web best practices).
When to use
Use this skill when the user needs help with tasks related to design guide.
Guidelines
- Follow repository conventions in
paperclipai/paperclip - Prefer minimal, focused changes
- Validate outputs before finishing