
design-guide
Provides guidelines for creating consistent and reusable UI components in the Paperclip design system.
What it does
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).
Quality judgment
An exceptionally thorough, well-organized design guide with concrete tokens, exact Tailwind patterns, code examples, file conventions, and a common-mistakes section. Trigger description is explicit and well-scoped; only minor gaps are missing visual reference assets and some examples being partial snippets.