Guide UI design fundamentals covering layout, typography, color, spacing, and accessibility.
npx skills add https://github.com/wpank/ai --skill ui-design-wpank
Please help me install this Agent Skill. Skill: ui-design Source: https://github.com/wpank/ai/tree/main/skills/design-systems/ui-design Command: npx skills add https://github.com/wpank/ai --skill ui-design-wpank
This Skill provides a comprehensive guide to building high-quality, production-grade web interfaces, addressing common design pitfalls and ensuring accessibility.
Use the ui-design skill to learn about best practices for web interface typography.
High-intent search queries and answers about installing and using this skill.
UI design fundamentals for web interfaces cover layout, typography, color, spacing, and visual hierarchy. These core principles guide the arrangement of elements to ensure usable, accessible, and production-grade frontend designs.
To ensure consistent frontend typography and spacing, apply standardized design rules and decision trees. This provides practical guidance for maintaining visual hierarchy and readable text across all web interface components.
Common UI design mistakes affecting accessibility include ignoring WCAG standards, poor color contrast, and inadequate responsive design techniques. Avoiding these pitfalls ensures interfaces remain usable for all users.
Design accessible and responsive web components by integrating WCAG standards and responsive design techniques. This approach ensures your UI layout adapts correctly across devices while maintaining proper visual hierarchy.
Yes, this UI design guidance covers component states and motion. It provides comprehensive rules and best practices for managing interaction states and motion within production-grade web interfaces.
Apply visual hierarchy in UI layout design whenever structuring web interfaces to guide user attention. It is a fundamental principle needed to establish clear relationships between layout, typography, and color elements.
Cumulocity-IoTScaffolds Cumulocity UI projects and implements HTML layouts using Codex design system classes.
AngelDannGenerate cohesive frontend interfaces with typography, color, motion, and layout guidelines.
eymassStandardize React frontend design patterns for accessible UI development.
udecodeCodify React UI design systems with pattern catalogs and typography tokens.
