SKILL.md files package domain expertise into something any AI agent can use. Drop one into your project and your agent learns how to process PDFs, design interfaces, write tests, or whatever the skill teaches.
28 skills
Use when starting any conversation - establishes how to find and use skills, requiring Skill tool invocation before ANY response including clarifying questions
Instead of generic AI design help, Design Studio loads specialized design knowledge for each task — the right expertise activates based on what you're building. Quick Start · Commands · The Team · How It Works · Changelog Running /design Build a pricing page with monthly/annual toggle automatically loads UI Designer, Content Designer, Motion Designer, and Design System Lead references — each contr
Build accessible design systems with Radix UI primitives. Headless component customization, theming strategies, and compound component patterns for production-grade UI libraries.
Transforms vague UI ideas into polished, Stitch-optimized prompts. Enhances specificity, adds UI/UX keywords, injects design system context, and structures output for better generation results.
Guide for quality focused software architecture. This skill should be used when users want to write code, design architecture, analyze code, in any case that relates to software development.
Create interface designs, wireframes, and design systems. Masters
Build scalable design systems with Tailwind CSS, design tokens, component libraries, and responsive patterns. Use when creating component libraries, implementing design systems, or standardizing UI patterns.
A fast, lightweight Model Context Protocol (MCP) server that empowers LLMs with browser automation via Puppeteer’s structured accessibility data, featuring optional vision mode for complex visual understanding and flexible, cross-platform configuration. - ⚡ Fast & lightweight. Utilizes Puppeteer's label index, not pixel-based input and accessibility DOM tree. - 👁️ Vision Mode Support. Optional vi
Game art principles. Visual style selection, asset pipeline, animation workflow.
Translate Figma nodes into production-ready code with 1:1 visual fidelity using the Figma MCP workflow (design context, screenshots, assets, and project-convention translation). Trigger when the user provides Figma URLs or node IDs, or asks to implement designs or components that must match Figma specs. Requires a working Figma MCP server connection.
Upgrade Next.js to the latest version following official migration guides and codemods
When the user wants help with paid advertising campaigns on Google Ads, Meta (Facebook/Instagram), LinkedIn, Twitter/X, or other ad platforms. Also use when the user mentions 'PPC,' 'paid media,' 'ad copy,' 'ad creative,' 'ROAS,' 'CPA,' 'ad campaign,' 'retargeting,' or 'audience targeting.' This skill covers campaign strategy, ad creation, audience targeting, and optimization.
Master TypeScript with advanced types, generics, and strict type
Core component library and design system patterns. Use when building UI, using design tokens, or working with the component library.
Manage multiple local CLI agents via tmux sessions (start/stop/monitor/assign) with cron-friendly scheduling.
Design DDD strategic artifacts including subdomains, bounded contexts, and ubiquitous language for complex business domains.
>
Simplification and readability techniques. Use when writing for broad audiences or simplifying complex content. Covers active voice, short sentences, jargon elimination, and accessibility principles from the Plain Language Movement.
Validates animation durations, enforces typography scale, checks component accessibility, and prevents layout anti-patterns in Tailwind CSS projects. Use when building UI components, reviewing CSS utilities, styling React views, or enforcing design consistency.
Design Skill OS is not just a document; it's a professional-grade reasoning layer that transforms standard AI outputs into elite-level design masterworks. We have exhaustively synthesized principles from the "Design Bibles" to prime your AI agent with the strategic intent of a world-class Creative Director. The intelligence core is distilled from the collective wisdom of masters: - Milton Glaser (
This skill should be used when the user asks to "understand context", "explain context windows", "design agent architecture", "debug context issues", "optimize context usage", or discusses context components, attention mechanics, progressive disclosure, or context budgeting. Provides foundational understanding of context engineering for AI agent systems.
This MCP server provides a tool to download entire websites using wget. It preserves the website structure and converts links to work locally. The server requires wget to be installed on your system. Using Homebrew: 1. Using Chocolatey: 2. Or download the binary from: https://eternallybored.org/misc/wget/ - Download the latest wget.exe - Place it in a directory that's in your PATH (e.g., C:\Window
Automate Figma tasks via Rube MCP (Composio): files, components, design tokens, comments, exports. Always search tools first for current schemas.
|