Design Tools Agent Skills

Design Exploration

Generates interactive visual catalogues and diverse UI proposals to guide aesthetic direction before implementation.

Design Lab

Conducts design interviews and generates five distinct UI variations directly within your project environment for rapid prototyping.

Frontend Design

Generates distinctive, production-grade frontend interfaces with high-fidelity aesthetics that avoid generic AI-generated patterns.

Frontend Design Systems

Standardize your UI development with production-ready design tokens, accessible components, and scalable frontend patterns.

Canvas Design

Generates museum-grade visual art and custom design philosophies for posters and high-fidelity digital assets.

Gemini Image Generation

Generates and edits high-quality images using the Gemini API to streamline visual asset creation within your development workflow.

Web Interface Design Reviewer

Audits frontend code against Vercel's Web Interface Guidelines to ensure accessibility, UX consistency, and design excellence.

Algorithmic Art Creator

Generates sophisticated, interactive generative art and computational visualizations using p5.js and seeded randomness.

Chakra UI Design System

Builds and refactors accessible frontend interfaces using Chakra UI v2, Emotion, and customized theme tokens.

Accessibility Patterns

Builds inclusive web experiences by implementing WCAG guidelines, semantic HTML, and ARIA patterns.

FeedMob Brand Guidelines & Content Generator

Generates professional, on-brand FeedMob content including reports, presentations, and data visualizations following official style requirements.

Accessibility Patterns & WCAG Compliance

Builds inclusive web experiences by implementing WCAG guidelines, semantic HTML, and accessible ARIA patterns.

Frontend Design Systems

Implements consistent, scalable UI components and design tokens to build maintainable and accessible frontend architectures.

Interfaith Sacred Geometry

Generates mathematically precise sacred geometry patterns and interfaith symbols for spiritual visualizations and art.

Theme Factory

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

Remotion Best Practices

Optimizes programmatic video creation in React by providing expert patterns for Remotion animations, compositions, and assets.

Responsive Design Patterns

Implements mobile-first layouts, fluid typography, and adaptive components for seamless cross-device user experiences.

Anthropic Brand Styling

Applies Anthropic's official brand colors, typography, and visual identity standards to digital artifacts and documents.

Accessible Contrast Solver

Implements APCA and WCAG2 accessibility standards through deterministic color contrast solvers and validation logic.

Canvas Design Pro

Generates museum-quality visual art and professional posters in PNG and PDF formats using a philosophy-driven design approach.

Color Pipeline Implementer

Builds and manages programmatic color processing pipelines for design systems and modern frontend applications.

Frontend Design

Creates distinctive, production-grade frontend interfaces with high design quality and unique aesthetic choices.

UI Component Variants

Generates and manages multi-style UI components using Class Variance Authority (CVA) for robust design systems.

Web Design Guidelines Auditor

Audits web interfaces for compliance with modern UX, accessibility, and design best practices.

Web Design Guidelines

Audits web application code against modern UI/UX best practices and accessibility standards using live design guidelines.

Claude Artifacts Builder

Generates complex, multi-component React artifacts for Claude.ai using shadcn/ui and professional design patterns.

UI Engineering Skills

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

UI Design Skills

Enforces opinionated constraints and professional best practices for building high-performance, accessible web interfaces.

UI Freeze

Protects critical design system files and global CSS from accidental modifications by requiring explicit confirmation and impact analysis.

Responsive Design Patterns

Implements mobile-first responsive layouts, fluid typography, and touch-optimized components using industry-standard patterns.