Design Tools Agent Skills

UI/UX Pro Max - Design Intelligence

57

Enhances frontend development with a comprehensive design intelligence database for creating stunning, accessible, and high-performance user interfaces.

UX Design Expert

56

Provides expert UI/UX guidance to create unique, accessible, and functional web interfaces while maintaining strict design decision collaboration.

Innovative UX Designer

56

Creates distinctive, production-grade frontend interfaces using advanced design thinking and aesthetic principles that move beyond generic AI patterns.

Web Accessibility Assistant

55

Implements WCAG 2.1 compliant web components and ARIA patterns to ensure inclusive and accessible user experiences.

Frontend Development Standards

54

Enforces Vue 3 and TypeScript best practices while ensuring professional, production-grade UI design and state management.

Atris Frontend Design

54

Enforces high-end aesthetic policies to prevent generic, AI-generated looks in frontend components and user interfaces.

Vue JavaScript Expert

49

Builds modern Vue 3 applications using pure JavaScript and JSDoc for type safety without the overhead of TypeScript.

Frontend Component Generator

47

Generates production-ready React and Vue components complete with TypeScript interfaces, unit tests, and scoped styling.

Product Design & Figma Handoff

47

Automates the Figma-to-code handoff process by extracting design tokens, mapping components, and generating phased implementation plans.

Web Interface Guidelines Auditor

46

Audits web application code for compliance with modern interface guidelines, accessibility standards, and UX best practices.

Frontend Responsive

45

Implements responsive design patterns and mobile-first layouts according to established frontend coding standards.

Frontend Components

45

Enforces standardized coding patterns and implementation guidelines for building consistent, high-quality frontend components.

Frontend CSS

45

Enforces standardized coding practices and implementation patterns for frontend styling to ensure consistent and maintainable CSS.

Frontend Accessibility

45

Ensures user interfaces meet established accessibility standards through guided coding practices and inclusive design patterns.

AI Draw.io Diagram Generator

45

Generates professional draw.io flowcharts and architecture diagrams from natural language with instant browser previews.

Tailwind CSS Styling Patterns

44

Streamlines frontend development using utility-first CSS patterns for responsive, high-performance web interfaces.

Shadcn/UI Design System

44

Streamlines the implementation of accessible, high-quality React components using shadcn/ui, Radix UI, and Tailwind CSS.

Brand.yml Identity Manager

42

Standardizes brand identity across Shiny applications and Quarto documents using a unified YAML configuration.

TouchDesigner Guide

42

Streamlines TouchDesigner network development by providing standardized patterns for operator creation, data conversion, and GLSL shading.

Nano Banana Prompting

40

Crafts optimized image generation prompts for Nano Banana Pro using structured techniques and visual reference analysis.

Frontend Design

40

Generates distinctive, production-grade web interfaces with high-quality aesthetics that avoid generic AI design patterns.

Theme Factory

40

Applies professional color palettes and font pairings to digital artifacts like presentations, documents, and landing pages.

Professional UI Design & Polish

40

Enforces opinionated constraints and best practices for building accessible, high-performance, and visually consistent user interfaces.

Nano Banana

40

Generates high-quality AI images and executes specialized Python scripts using inline dependency management and Gemini models.

Tailwind CSS Utility Classes

39

Accelerates UI development by providing specialized guidance on Tailwind CSS utility-first patterns, responsive design, and state management.

Vue Component Patterns

39

Implements professional Vue 3 component architectures including type-safe props, emits, slots, and dependency injection.

Ink Component Patterns

39

Builds professional terminal user interfaces using React-based Ink patterns and best practices.

Storybook Component Documentation

39

Generates comprehensive, professional-grade component documentation using Storybook MDX, autodocs, and JSDoc.

Storybook Args & Controls

39

Configures interactive controls and args for Storybook stories to create dynamic, explorable UI component demonstrations.

React Performance Optimizer

39

Optimizes React applications by implementing advanced memoization, code splitting, list virtualization, and rendering strategies.