> browse/registry

> frontend-design

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.

> design-guide

Paperclip UI design system guide for building consistent, reusable frontend components. Use when creating new UI components, modifying existing ones, adding pages or features to the frontend, styling UI elements, or when you need to understand the design language and conventions. Covers: component creation, design tokens, typography, status/priority systems, composition patterns, and the /design-guide showcase page. Always use this skill alongside the frontend-design skill (for visual quality) a

> antigravity-design-expert

Core UI/UX engineering skill for building highly interactive, spatial, weightless, and glassmorphism-based web interfaces using GSAP and 3D CSS.

> product-design

Design de produto nivel Apple — sistemas visuais, UX flows, acessibilidade, linguagem visual proprietaria, design tokens, prototipagem e handoff. Cobre Figma, design systems, tipografia, cor, espacamento, motion design e principios de design cognitivo.

> k8s-core

Core Kubernetes resource management for pods, namespaces, configmaps, secrets, and nodes. Use when listing, inspecting, or managing fundamental K8s objects.

> chrome-extension-ui

Chrome Extensions UX/UI design and implementation guidelines for popups, side panels, content scripts, and options pages. Triggers on tasks involving browser extension UI, manifest v3, chrome APIs.

> ui-design

UI/UX and frontend design best practices guidelines (formerly frontend-design). This skill should be used when writing, reviewing, or designing frontend code to ensure accessibility, performance, and usability. Triggers on tasks involving HTML structure, CSS styling, responsive layouts, form design, animations, or accessibility improvements.

> tailwind-ui-refactor

Refactoring UI design patterns for Tailwind CSS applications. This skill should be used when writing, reviewing, or refactoring HTML with Tailwind utility classes to improve visual hierarchy, spacing, typography, color, depth, and polish. Triggers on tasks involving UI cleanup, design review, Tailwind refactoring, component styling, or visual improvements.

> figma-bridge

How to use Figma MCP and Variables2CSS to read designs from Figma and generate code consistent with tokens. Use when the designer shares a Figma link.

> ux-sentinel

Continuously detect recurring UI/UX concepts during frontend discussions, track conversation-wide recurrence, and register repeated concepts as structured knowledge assets in a Notion database via MCP.

> figma-api

Interact with the Figma REST API to read design files, export assets, extract components, and pull design tokens programmatically. Use when tasks involve automating design handoff, syncing design tokens to code, exporting icons/images from Figma, or building integrations between Figma and development pipelines.

> figma-implement-design

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.

> figma-to-code

Convert Figma designs into production-ready frontend code. Use when someone shares a Figma URL, design screenshot, or exported design tokens and needs React/Vue/HTML components, responsive layouts, or design system code. Trigger words: Figma, design to code, mockup, wireframe, UI implementation, pixel perfect, design handoff, component from design.

> figma

Use the Figma MCP server to fetch design context, screenshots, variables, and assets from Figma, and to translate Figma nodes into production code. Trigger when a task involves Figma URLs, node IDs, design-to-code implementation, or Figma MCP setup and troubleshooting.

> ui-ux-pro-max

Complete UI/UX design intelligence and implementation guidance for polished interfaces. Use when a user asks to improve UX, redesign an interface, create a design system, review UI patterns, improve user flows, design forms, build navigation, or make an interface more intuitive and polished.

> kubernetes-helm

Manages Kubernetes clusters and Helm charts. Use when the user wants to write Kubernetes manifests, create Helm charts, deploy applications, debug pods, configure networking (services, ingress), set up autoscaling, manage secrets and config maps, write operators, troubleshoot cluster issues, or implement GitOps workflows. Trigger words: kubernetes, k8s, kubectl, helm, helm chart, pod, deployment, service, ingress, namespace, configmap, secret, hpa, pvc, statefulset, daemonset, cronjob, operator,

> pyside6-ui-engineer

Design, implement, refactor, and review PySide6 desktop applications with strong widget architecture, signal-slot design, state flow, and expert UI/UX logic. Use when building or fixing Qt for Python windows, dialogs, forms, navigation shells, model-view tables, theming, validation, accessibility, or interaction polish in Python GUI code.

> inc-prd-figma-make

Convert Product Requirements Documents (PRDs) into functional Figma Make prototype instructions for product and UX design workflows. Use when a user provides a PRD (complete or partial) and needs structured, build-ready guidance for screens, user flows, states, interactions, data behavior, edge cases, and acceptance criteria mapping.

> k8s-manifest-generator

Create production-ready Kubernetes manifests for Deployments, Services, ConfigMaps, and Secrets following best practices and security standards. Use when generating Kubernetes YAML manifests, creating K8s resources, or implementing production-grade Kubernetes configurations.

> visualise

Render inline interactive visuals — SVG diagrams, HTML widgets, charts, and explainers — directly in the conversation. Use this skill whenever the user asks to visualize, diagram, chart, illustrate, or explain something visually, or when an explanation would genuinely benefit from a spatial/interactive diagram rather than text. Also triggers for: flowcharts, architecture diagrams, data visualizations, interactive explainers, comparison layouts, UI mockups, and any request containing 'show me', '