Design

A structured framework for guiding designers through early-stage exploration, focusing on research, ideation, and evidence-based decision-making. It enforces asking for missing information, tracking input confidence, and generating multiple options before converging.

A structured workflow skill for capturing visual design systems through iterative questioning, enabling creation of aesthetic templates before plugin implementation with clear phase-based execution.

This skill guides Claude through a two-step process to create visual art. First, it generates a detailed design philosophy manifesto. Then, it uses that philosophy to produce a polished PDF or PNG artwork, emphasizing craftsmanship, minimal text, and spatial expression over literal representation.

Provides detailed Mantel brand styling rules for diagrams and frontend components. Includes Mermaid theme definitions, CSS variables, component guidelines, and Tailwind config. Helps maintain visual consistency across technical documentation and UI implementations.

Provides a structured methodology and concrete guidelines for building accessible, responsive web interfaces. Focuses on practical workflows, component selection from popular design systems (shadcn/ui, daisyUI, HeroUI), and avoiding common pitfalls. It's a detailed reference for developers who need to implement polished UIs with features like chat, terminals, and code display.

Generates design system tokens including color palettes, typography scales, spacing grids, and responsive breakpoints from a base brand color. Exports to JSON, CSS, or SCSS formats. Helps maintain visual consistency across projects with automated token generation.

This skill generates structured design briefs with sections for project overview, goals, users, scope, and deliverables. It includes practical examples, validation scripts, and accessibility guidelines. It helps designers formalize project requirements and align stakeholders.