design-assistant

UI/UX mockups guide interface design by visualizing layouts, user flows, and interactions before development. This skill generates wireframes and prototypes in React or HTML with Tailwind, applying visual hierarchy and accessibility best practices to produce functional, design-ready code.

Yes. Design systems establish scalability and consistency through color theory, typography rules, and UI principles. This skill provides in-depth guidance on these foundations and helps you document and apply them across web, mobile, and print contexts for cohesive brand identity.

SVG and canvas-based code produce scalable vector graphics for logos and icons. This skill creates brand-tailored graphics by generating SVG markup or canvas implementations that maintain quality across sizes and contexts.

Accessible interface design balances visual hierarchy with WCAG standards to ensure usability across abilities. This skill applies accessibility principles when creating mockups and prototypes, ensuring color contrast, readable typography, and semantic structure in HTML and React outputs.

Yes. This skill guides you through rapid prototyping by gathering requirements, suggesting design approaches aligned with your brand, and generating functional HTML or React mockups. You describe your needs—style, color, context—and receive a design-ready prototype.

No. This skill handles design fundamentals and best practices so you can produce professional outputs without specialized training. It translates your requirements into mockups, graphics, and design decisions, then delivers code-ready artifacts.