Skill UI

Analyze Stitch projects and synthesize a semantic design system into DESIGN.md files

Visits target URLs to capture screenshots and inspect pages, then extracts palettes, typography, layouts, and repeatable UI patterns so design teams can document inspiration for new projects.

Automates Mermaid Gantt chart creation and guidance for diagrams, best practices, and production-ready outputs, ensuring clear visual documentation for presentations and project planning.

Research current UI/UX visual trends from Dribbble and related design communities to inform color, typography, layout, and interaction choices before starting a project.

A comprehensive skill for generating multimodal media content using fal.ai models. It supports text-to-image (Nano Banana), text/image-to-video (Veo, Kling, Seedance), and text/video-to-audio (CSM-1B, ThinkSound). Use this tool for any creative project requiring high-quality generated images, videos, or sound effects.

Upgrades existing websites and apps to premium quality by auditing typography, color, layout, and UI patterns, then applying targeted tweaks within the current stack without rewrites.

Automates Figma workflows via Composio's Rube MCP client, covering file inspection, exports, design token extraction, comments, and project browsing while enforcing tool discovery first.

This skill acts as an expert Design Systems Lead, analyzing complex technical assets (HTML, CSS, screenshots) from existing projects. It synthesizes a comprehensive 'Semantic Design System' into a structured DESIGN.md file. This output serves as the authoritative 'source of truth' for AI prompting, ensuring that any new UI generated by tools like Stitch adheres perfectly to the established visual language, color palette, and component standards.

This skill provides expert-level, comprehensive guidelines for building a cohesive and playful design system, optimized for landing pages and creative projects. It defines foundational elements using semantic tokens, covering typography, color palettes, and spacing. The system mandates WCAG 2.2 AA accessibility, defining rigorous component anatomy, interaction states, and detailed authoring workflows to ensure both aesthetic appeal and cross-platform usability.