MCP Skill Hub

Interactive design exploration workflow: conduct interviews, generate variants, and refine UI designs through feedback.

Design engineering principles for making interfaces feel polished, with focus on micro-interactions, typography, and visual details.

Practical OKLCH color workflow skill for building consistent, accessible, and tunable color systems in modern UIs.

Use when making single-property CSS or Tailwind visual changes in Next.js App Router projects. Presents a floating control widget for live tuning before persisting.

Run React Doctor to detect regressions in security, performance, correctness, and architecture, with score-based quality checks.

Real-time design feedback skill focused on accessibility, spacing, typography, contrast, and component quality.

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.

Compatibility listing for use-of-color installs from AccessLint's marketplace skill set.

Emil Kowalski's design-engineering philosophy for UI polish, components, animation, and production-ready frontend craft.

Audit Web Audio API code for procedural sound synthesis quality, UX decisions, and parameter best practices.

Audit Motion and Framer Motion exit/presence patterns with practical fixes for AnimatePresence usage.

Build icon components that morph between SVG shapes with smooth, line-based transformation.

Audit CSS pseudo-elements and View Transitions usage for hover effects, decorative layers, and transitions.

Audit interface sound feedback for UX quality, accessibility, and practical implementation patterns.

Audit animation timing choices to decide when springs versus easing curves produce better motion.

Create animation-rich HTML presentations from scratch or convert PPT/PPTX files into polished web slides.

Create beautiful, animated web presentations from a topic, rough notes, or an outline. Generates a custom theme and a short two-slide preview, then builds the full deck only once the user confirms the direction. Use when the user wants to make slides, a presentation, a talk deck, or a pitch deck.

Project-aware shadcn/ui workflow for searching, adding, composing, and fixing components with correct patterns.

Raw, mechanical interface direction mixing Swiss print structure with terminal-inspired brutalist aesthetics.

High-agency UX/UI skill with strict layout variance, typography, and GSAP motion engineering constraints.

Editorial minimal interfaces with monochrome palettes, typographic contrast, and restrained visuals.

Enforces complete, non-truncated code output and blocks placeholder or half-finished responses.

Audit and upgrade existing interfaces to premium visual quality while preserving product functionality.

High-end visual design guidance for premium typography, spacing, depth, and animation systems.

Semantic design-system skill for Google Stitch with strict anti-generic UI generation rules.

Senior UI/UX frontend skill that enforces anti-slop design decisions, motion quality, and architecture discipline.

Adapt designs across breakpoints, device contexts, and platform constraints with responsive interaction quality.

Enhance UX with purposeful animation and micro-interactions that support usability and delight.

Run technical UI quality audits across accessibility, performance, theming, responsive behavior, and anti-patterns.

Increase visual impact and personality for interfaces that feel too safe, bland, or generic.