design-patterns

Design tokens are reusable variables for colors, typography, and spacing that maintain UI consistency. This Skill provides token-based guidelines and component specs to ensure cohesive visual design across web and mobile breakpoints.

To create a WCAG 2.1 AA compliant design system, apply this Skill's accessibility patterns and component visual specifications. It provides Markdown-driven guidelines and YAML frontmatter to load token definitions for quick adoption.

You can apply design token systems without external software. This Skill relies entirely on Markdown-driven guidelines and YAML frontmatter to load token definitions, component specs, and anti-patterns directly in your workflow.

The best way to define rules for a new UI screen is instructing the AI to apply token-based design rules. This generates outlined tokens for color, typography, and spacing, preventing inconsistency in product interfaces.

You need reusable visual design patterns when solving inconsistency in UI design. This Skill provides component specifications and anti-patterns for design systems, ensuring cohesive visual output across different product interfaces.

Yes, this approach covers responsive design across breakpoints. The Skill provides component visual specifications and WCAG 2.1 AA accessibility patterns that adapt consistently across web and mobile interfaces.