Design
UI/UX direction, visual design, and design systems
superdesign
by superdesigndev
Superdesign is a design agent specialized in frontend UI/UX design. Use this skill before implementing any UI that requires design thinking. Common commands: superdesign create-project --title "X" (setup project), superdesign create-design-draft --project-id <id> --title "Current UI" -p "Faithfully reproduce..." --context-file src/Component.tsx (faithful reproduction), superdesign iterate-design-draft --draft-id <id> -p "dark theme" -p "minimal" --mode branch --context-file src/Component.tsx (design variations), superdesign execute-flow-pages --draft-id <id> --pages '[...]' --context-file src/Component.tsx (extend to more pages). Supports line ranges: --context-file path:startLine:endLine
mockuplm
by nimbalyst
Create visual UX mockups using HTML/CSS files (.mockup.html). Use when the user wants to design UI, wireframes, visual layouts, or plan features visually.
figma-use
by dannote
Control Figma via CLI — create shapes, frames, text, components, set styles, layout, variables, export images. Use when asked to create/modify Figma designs or automate design tasks.
excalidraw
by nimbalyst
Create diagrams and visual drawings using Excalidraw (.excalidraw files). Use when the user wants flowcharts, architecture diagrams, system diagrams, sketches, or any visual diagram. For database schemas and entity relationship diagrams, use the DataModelLM extension instead.
animation
by nimbalyst
Author animated technical explainer diagrams as .anim.json files for Nimbalyst's Animation editor. Use when the user wants to animate a diagram, show how a system/protocol/algorithm behaves over time, build a motion explainer, or turn a static architecture diagram into something that plays.
feedback-intake
by nimbalyst
Help the user file a bug report or feature request for Nimbalyst. Activates when the user opens the in-app feedback flow or runs /feedback:bug-report or /feedback:feature-request. Coordinates evidence gathering, anonymization, and posting to GitHub Issues.
design-exploration
by BuilderIO
Use Design for UI/UX exploration, side-by-side design directions, interactive prototype previews, user selection, iteration, and design-to-code handoff through the hosted Design MCP app.
configuration
by BuilderIO
Where a configuration value belongs — app config schema, agent-native.config.ts, or an environment variable — and how the layers resolve. Use before adding an env var, a configure*/set* function, a plugin option, or a register* function, and when deciding whether something is config or a registry.
shadcn-ui
by BuilderIO
Project-aware shadcn/ui components, registry MCP, theming, and design-system lint feedback. Use when adding or changing React/Tailwind UI, a primitive, theme, registry, or component contract in an Agent-Native app.
visual-recap
by BuilderIO
Turn a PR, branch, commit, or git diff into an interactive visual recap with diagrams, file maps, API/schema summaries, annotated diffs, and focused review notes.
frontend-design
by BuilderIO
Sets the visual direction for UI work, avoiding generic AI aesthetics. Use for any user-facing UI change: new surfaces, screenshot-driven feedback, copy/density cleanup, settings, control placement, or a "make this look good" pass. Do not load it only for purely mechanical wiring or formatting.
visual-plan
by BuilderIO
Turn ordinary text plans into rich interactive visual plans with diagrams, file maps, annotated code, open questions, and UI/prototype review when useful.
canvas
by nimbalyst
Author Nimbalyst Project Canvas boards (.canvas files) — an infinite canvas whose cards are live editors for real workspace files and shared documents, arranged spatially and wired with edges. Use when the user asks for a canvas, a board, a spatial layout of documents or mockups, a flow of screens, or a workspace overview.
seo-analysis
by nowork-studio
Full SEO audit: Google Search Console data + URL Inspection API + PageSpeed Insights API + technical crawl + keyword research + metadata audit + schema markup audit + search intent analysis + Core Web Vitals monitoring. Feeds real GSC data and PageSpeed metrics into AI to surface quick wins, diagnose traffic drops, find content gaps, identify metadata mismatches, detect schema gaps, monitor page performance, and produce an actionable 30-day plan. Use this skill whenever the user asks about SEO, search rankings, organic traffic, Google Search Console, keyword performance, traffic drops, content gaps, search visibility, technical SEO, meta tags, schema markup, structured data, URL indexing, keyword research, indexing issues, page speed, performance, Core Web Vitals, LCP, INP, CLS, or Lighthouse scores. Also trigger on: "why is my traffic down", "what keywords am I ranking for", "improve my rankings", "check my search console", "SEO audit", "analyze my SEO", "technical SEO", "meta tags", "indexing issues", "crawl errors", "content strategy", "keyword cannibalization", "search intent", "schema markup", "structured data", "URL inspection", "page speed", "performance score", "core web vitals", "lighthouse", or any organic search question. If in doubt, trigger. This skill handles everything from quick GSC checks to deep technical audits with performance monitoring.
geo-optimizer
by nowork-studio
Generative Engine Optimization (GEO) — make content rank in AI search answers from ChatGPT, Claude, Perplexity, Gemini, and Google AI Overviews. Audits existing content, rewrites for AI citation, and produces per-engine strategy. Use when asked to "optimize for AI search", "rank in ChatGPT", "GEO audit", "improve AI citations", "rank in Perplexity", "AI Overview optimization", "AI Overview ranking", "LLM SEO", "answer engine optimization", "AEO", "get cited by AI", "GEO", "generative engine optimization", "show up in ChatGPT", "appear in AI answers", "be cited by Perplexity", "SGE optimization", "Search Generative Experience", or "make my content show up in AI answers". Distinct from regular SEO — this targets generative engines, not traditional Google rankings.
content-writer
by nowork-studio
Write SEO-optimized blog posts, landing pages, and content improvements following Google's E-E-A-T and Helpful Content guidelines. Handles new content creation from a keyword or topic, and improving existing pages. Use when asked to "write a blog post", "create a landing page", "improve this page", "write content about X", "content for keyword X", "draft an article", "blog post about", "landing page for", "service page", "product page copy", "rewrite this page", "make this page rank better", "content brief", "how-to guide", "listicle", or any content creation or improvement task for a website.
paid-ads-setup
by nowork-studio
Connect NotFair paid-ad accounts and establish reusable campaign context. Use when setting up paid media in a new workspace, connecting Google, Meta, X, or LinkedIn Ads, refreshing brand context, or preparing an agent to work on ads safely.
meta-ads-audit
by nowork-studio
Meta Ads (Facebook + Instagram) account audit and business context setup. Run this first — it gathers business information, analyzes account health, and saves context that all other Meta ads skills reuse. Trigger on "audit my Meta ads", "audit my Facebook ads", "Meta ads audit", "set up my Meta ads", "onboard Meta", "Meta account overview", "how's my Meta account", "Meta health check", "what should I fix in my Facebook ads", or when the user is new to NotFair Meta and hasn't run an audit before. Also trigger proactively when other Meta ads skills detect that meta business-context.json is missing.
google-ads-copy
by nowork-studio
Generate and A/B test Google Ads copy. Use when asked to write ad copy, headlines, descriptions, create ad variants, test ad messaging, improve CTR, or generate RSA (Responsive Search Ad) components. Trigger on "ad copy", "write ads", "headlines", "descriptions", "RSA", "responsive search ad", "ad text", "ad creative", "improve CTR", "ad A/B test", "ad variants", "write me an ad", "ad variation experiment", or when the user wants to improve click-through rate on existing ads.
google-ads-landing
by nowork-studio
Score and diagnose Google Ads landing pages. Use when asked to audit a landing page, check landing page quality, diagnose high-CTR but low-conversion-rate ad groups, improve Quality Score's Landing Page Experience component, or compare an ad group's messaging against its landing page. Trigger on "landing page audit", "landing page score", "landing page quality", "why is my conversion rate low", "LPX", "landing page experience", "ad to page match", or when /google-ads-audit surfaces a high-CTR / low-CVR ad group.
meta-tags-optimizer
by nowork-studio
Optimize title tags, meta descriptions, Open Graph, and Twitter cards for maximum click-through rate. Generates multiple A/B test variations with character counting and SERP preview. Use when asked to "optimize title tag", "write meta description", "improve CTR", "Open Graph tags", "fix my meta tags", "social media preview", "my click rate is low", "title optimization", or any meta tag task.
broken-link-checker
by nowork-studio
Scans a website to find broken links (404s, 500s). Crawls internal pages, identifies broken outbound links, and reports source pages for easy fixing. Use this when the user asks to "check for broken links", "find 404s", "audit my links", or "is my site healthy".
google-ads-audit
by nowork-studio
Google Ads account audit and business context setup. Run this first — it gathers business information, analyzes account health, and saves context that all other ads skills reuse. Trigger on "audit my ads", "ads audit", "set up my ads", "onboard", "account overview", "how's my account", "ads health check", "what should I fix in my ads", or when the user is new to NotFair and hasn't run an audit before. Also trigger proactively when other ads skills detect that business-context.json is missing.
ux-designer
by szilu
Apply modern UX best practices when designing and reviewing interfaces. Use for UI/UX design, accessibility, usability, interaction design, user research, and frontend code review.