Design AI agent skills

3,804 skills in the archive. Read a skill’s instructions or open its original repository.

• Launchdarkly Ui Skills

  by @ihlamury

  Launchdarkly's UI design system. Use when building interfaces inspired by Launchdarkly's aesthetic - dark mode, Inter font, 4px grid.

• Planetscale Ui Skills

  by @ihlamury

  Planetscale's UI design system. Use when building interfaces inspired by Planetscale's aesthetic - dark mode, Inter font, 4px grid.

• Convertkit Ui Skills

  by @ihlamury

  Convertkit's UI design system. Use when building interfaces inspired by Convertkit's aesthetic - light mode, Inter font, 4px grid.

• Liveblocks Ui Skills

  by @ihlamury

  Liveblocks's UI design system. Use when building interfaces inspired by Liveblocks's aesthetic - dark mode, Inter font, 4px grid.

• Amplitude Ui Skills

  by @ihlamury

  Amplitude's UI design system. Use when building interfaces inspired by Amplitude's aesthetic - light mode, Inter font, 4px grid.

• Anthropic Ui Skills

  by @ihlamury

  Anthropic's UI design system. Use when building interfaces inspired by Anthropic's aesthetic - light mode, Inter font, 4px grid.

• Mailchimp Ui Skills

  by @ihlamury

  Mailchimp's UI design system. Use when building interfaces inspired by Mailchimp's aesthetic - light mode, Inter font, 4px grid.

• Pinterest Ui Skills

  by @ihlamury

  Pinterest's UI design system. Use when building interfaces inspired by Pinterest's aesthetic - light mode, Inter font, 4px grid.

• Airtable Ui Skills

  by @ihlamury

  Airtable's UI design system. Use when building interfaces inspired by Airtable's aesthetic - light mode, Inter font, 4px grid.

• Awwwards Ui Skills

  by @ihlamury

  Awwwards's UI design system. Use when building interfaces inspired by Awwwards's aesthetic - light mode, Inter font, 4px grid.

• Dribbble Ui Skills

  by @ihlamury

  Dribbble's UI design system. Use when building interfaces inspired by Dribbble's aesthetic - light mode, Inter font, 4px grid.

• Intercom Ui Skills

  by @ihlamury

  Intercom's UI design system. Use when building interfaces inspired by Intercom's aesthetic - light mode, Inter font, 4px grid.

• Mixpanel Ui Skills

  by @ihlamury

  Mixpanel's UI design system. Use when building interfaces inspired by Mixpanel's aesthetic - light mode, Inter font, 4px grid.

• Descript Ui Skills

  by @ihlamury

  Descript's UI design system. Use when building interfaces inspired by Descript's aesthetic - dark mode, Inter font, 4px grid.

• Obsidian Ui Skills

  by @ihlamury

  Obsidian's UI design system. Use when building interfaces inspired by Obsidian's aesthetic - dark mode, Inter font, 4px grid.

• Beehiiv Ui Skills

  by @ihlamury

  Beehiiv's UI design system. Use when building interfaces inspired by Beehiiv's aesthetic - light mode, Inter font, 4px grid.

• Copy Ai Ui Skills

  by @ihlamury

  Copy Ai's UI design system. Use when building interfaces inspired by Copy Ai's aesthetic - light mode, Inter font, 4px grid.

• Discord Ui Skills

  by @ihlamury

  Discord's UI design system. Use when building interfaces inspired by Discord's aesthetic - light mode, Inter font, 4px grid.

• Lattice Ui Skills

  by @ihlamury

  Lattice's UI design system. Use when building interfaces inspired by Lattice's aesthetic - light mode, Inter font, 4px grid.

• Mercury Ui Skills

  by @ihlamury

  Mercury's UI design system. Use when building interfaces inspired by Mercury's aesthetic - light mode, Inter font, 4px grid.

• Codeium Ui Skills

  by @ihlamury

  Codeium's UI design system. Use when building interfaces inspired by Codeium's aesthetic - dark mode, Inter font, 4px grid.

• Gumroad Ui Skills

  by @ihlamury

  Gumroad's UI design system. Use when building interfaces inspired by Gumroad's aesthetic - dark mode, Inter font, 4px grid.

• Posthog Ui Skills

  by @ihlamury

  Posthog's UI design system. Use when building interfaces inspired by Posthog's aesthetic - dark mode, Inter font, 4px grid.

• Railway Ui Skills

  by @ihlamury

  Railway's UI design system. Use when building interfaces inspired by Railway's aesthetic - dark mode, Inter font, 4px grid.

• Airbnb Ui Skills

  by @ihlamury

  Airbnb's UI design system. Use when building interfaces inspired by Airbnb's aesthetic - light mode, Inter font, 4px grid.

• Jasper Ui Skills

  by @ihlamury

  Jasper's UI design system. Use when building interfaces inspired by Jasper's aesthetic - light mode, Inter font, 4px grid.

• Mobbin Ui Skills

  by @ihlamury

  Mobbin's UI design system. Use when building interfaces inspired by Mobbin's aesthetic - light mode, Inter font, 4px grid.

• Notion Ui Skills

  by @ihlamury

  Notion's UI design system. Use when building interfaces inspired by Notion's aesthetic - light mode, Inter font, 4px grid.

• Openai Ui Skills

  by @ihlamury

  OpenAI's UI design system. Use when building interfaces inspired by OpenAI's aesthetic - light mode, Inter font, 4px grid.

• Paddle Ui Skills

  by @ihlamury

  Paddle's UI design system. Use when building interfaces inspired by Paddle's aesthetic - light mode, Inter font, 4px grid.

• Convex Ui Skills

  by @ihlamury

  Convex's UI design system. Use when building interfaces inspired by Convex's aesthetic - dark mode, Inter font, 4px grid.

• Framer Ui Skills

  by @ihlamury

  Framer's UI design system. Use when building interfaces inspired by Framer's aesthetic - dark mode, Inter font, 4px grid.

• Github Ui Skills

  by @ihlamury

  GitHub's UI design system. Use when building interfaces inspired by GitHub's aesthetic - dark mode, Inter font, 4px grid.

• Linear Ui Skills

  by @ihlamury

  Linear's UI design system. Use when building interfaces inspired by Linear's aesthetic - dark mode, Inter font, 4px grid.

• Matter Ui Skills

  by @ihlamury

  Matter's UI design system. Use when building interfaces inspired by Matter's aesthetic - dark mode, Inter font, 4px grid.

• Apple Ui Skills

  by @ihlamury

  Apple's UI design system. Use when building interfaces inspired by Apple's aesthetic - light mode, Inter font, 4px grid.

• Clerk Ui Skills

  by @ihlamury

  Clerk's UI design system. Use when building interfaces inspired by Clerk's aesthetic - light mode, Inter font, 4px grid.

• Craft Ui Skills

  by @ihlamury

  Craft's UI design system. Use when building interfaces inspired by Craft's aesthetic - light mode, Inter font, 4px grid.

• Figma Ui Skills

  by @ihlamury

  Figma's UI design system. Use when building interfaces inspired by Figma's aesthetic - light mode, Inter font, 4px grid.

• Front Ui Skills

  by @ihlamury

  Front's UI design system. Use when building interfaces inspired by Front's aesthetic - light mode, Inter font, 4px grid.

• Gusto Ui Skills

  by @ihlamury

  Gusto's UI design system. Use when building interfaces inspired by Gusto's aesthetic - light mode, Inter font, 4px grid.

• Loops Ui Skills

  by @ihlamury

  Loops's UI design system. Use when building interfaces inspired by Loops's aesthetic - light mode, Inter font, 4px grid.

• Monzo Ui Skills

  by @ihlamury

  Monzo's UI design system. Use when building interfaces inspired by Monzo's aesthetic - light mode, Inter font, 4px grid.

• Pitch Ui Skills

  by @ihlamury

  Pitch's UI design system. Use when building interfaces inspired by Pitch's aesthetic - light mode, Inter font, 4px grid.

• Ashby Ui Skills

  by @ihlamury

  Ashby's UI design system. Use when building interfaces inspired by Ashby's aesthetic - dark mode, Inter font, 4px grid.

• Ghost Ui Skills

  by @ihlamury

  Ghost's UI design system. Use when building interfaces inspired by Ghost's aesthetic - dark mode, Inter font, 4px grid.

• Plaid Ui Skills

  by @ihlamury

  Plaid's UI design system. Use when building interfaces inspired by Plaid's aesthetic - dark mode, Inter font, 4px grid.

• Bear Ui Skills

  by @ihlamury

  Bear's UI design system. Use when building interfaces inspired by Bear's aesthetic - light mode, Inter font, 4px grid.

• Brex Ui Skills

  by @ihlamury

  Brex's UI design system. Use when building interfaces inspired by Brex's aesthetic - light mode, Inter font, 4px grid.

• Coda Ui Skills

  by @ihlamury

  Coda's UI design system. Use when building interfaces inspired by Coda's aesthetic - light mode, Inter font, 4px grid.

• Deel Ui Skills

  by @ihlamury

  Deel's UI design system. Use when building interfaces inspired by Deel's aesthetic - light mode, Inter font, 4px grid.

• Loom Ui Skills

  by @ihlamury

  Loom's UI design system. Use when building interfaces inspired by Loom's aesthetic - light mode, Inter font, 4px grid.

• Miro Ui Skills

  by @ihlamury

  Miro's UI design system. Use when building interfaces inspired by Miro's aesthetic - light mode, Inter font, 4px grid.

• Neon Ui Skills

  by @ihlamury

  Neon's UI design system. Use when building interfaces inspired by Neon's aesthetic - dark mode, Inter font, 4px grid.

• Arc Ui Skills

  by @ihlamury

  Arc's UI design system. Use when building interfaces inspired by Arc's aesthetic - light mode, Inter font, 4px grid.

• Cal Ui Skills

  by @ihlamury

  Cal's UI design system. Use when building interfaces inspired by Cal's aesthetic - light mode, Inter font, 4px grid.

• Mem Ui Skills

  by @ihlamury

  Mem's UI design system. Use when building interfaces inspired by Mem's aesthetic - light mode, Inter font, 4px grid.

• N26 Ui Skills

  by @ihlamury

  N26's UI design system. Use when building interfaces inspired by N26's aesthetic - dark mode, Inter font, 4px grid.

• Shadcn Ui Components

  by @korallis

  Build beautiful, accessible UI components using shadcn/ui library with Radix UI primitives and Tailwind CSS styling that you own and can customize. Use when creating accessible component libraries, implementing common UI…

• Tailwind Design System

  by @korallis

  Create consistent, scalable design systems using Tailwind CSS utility classes with custom themes, design tokens, and responsive design patterns. Use when building design systems, implementing custom themes, creating reusable…

• Canvas Design

  by @korallis

  Create visual designs, graphics, and layouts using HTML Canvas API or design tools for data visualization, graphics, animations, and interactive visual content. Use when creating data visualizations, building interactive…

• Brand Guidelines

  by @korallis

  Create and maintain comprehensive brand guidelines including visual identity, tone of voice, messaging, color palettes, typography, and usage rules for consistent brand expression. Use when establishing brand identity, creating…

• Domain Name Brainstormer

  by @korallis

  Generate creative, memorable, and available domain name ideas for projects, products, and businesses with consideration for branding, SEO, and availability. Use when naming new projects, finding available domains, creating…

• Ultimate Design System Master

  by @fabricioctelles

  Create comprehensive design systems, brand identities, and UI component libraries. Use when the user says "create design system", "build brand identity", "design UI components", "generate design tokens", "create figma specs",…

• Agents Hooks

  by @vasilyu1983

  Configures Claude Code hooks and Codex hooks.json/notify callbacks. Use when adding guardrails, preflight, audit trails, worktree automation, or budget enforcement.

• Slop Eval

  by @fabricioctelles

  Objectively evaluate a UI/web design against the pols.dev anti-slop design law: detect catalogued slop tells with cited evidence, score 8 weighted axes (color, type, components, layout, motion, execution, signature, cohesion),…

• Generating Weaverse Project Json

  by @Weaverse

  Use when generating Weaverse project export JSON for import into the Weaverse editor. Triggers on requests to create, build, or produce a Weaverse project JSON file from a site migration, design spec, page layout description, or…

• Design Md Validator

  by @fabricioctelles

  Validate DESIGN.md files against the official Google specification using the `@google/design.md` CLI linter. Works with local files. Use when the user wants to lint a DESIGN.md, check spec compliance, find broken token…

• Figma To Weaverse

  by @Weaverse

  Use when recreating a Figma design as Hydrogen + Weaverse pages in this repo — turning a Figma file, frame, or flow into reusable Weaverse sections. Triggers on a figma.com URL, "build this design", "implement this Figma", or…

• Theme Update

  by @Weaverse

  Safely update a Weaverse Pilot theme to the latest version — detects current version, fetches release diffs, plans changes category-by-category, preserves customizations, verifies build.

• Milimo System Architect

  by @mainza-ai

  Provides deep expertise on the Milimo Video system architecture, including the split React/FastAPI design, Zustand God Store, Server-Sent Events (SSE) job tracking, and the SAM 3 microservice integration. Use this when you are…

• Milimo Frontend State Manager

  by @mainza-ai

  Strict guidelines for the Milimo Video React 18/TypeScript frontend, specifically regarding the 7-slice Zustand God Store architecture, the SSE listener loops, and the "Magnetic V1" CSS-based timeline rendering logic. Use this…

• Cloning Websites To Weaverse

  by @Weaverse

  Use when recreating a reference website or brand hub in this Hydrogen plus Weaverse repo, especially when deciding whether to reuse sections, add global styles, update theme schema, or resolve conflicts between the live site and…

• Generated Raster Asset Pipeline

  by @MRCalderon3D

  Define acceptance, validation, and runtime integration rules for raster assets generated with image models before they become real project content.

• Game Feel Design

  by @MRCalderon3D

  Design moment-to-moment feedback — hit-stop, screen shake, tweening, and response timing — so actions feel readable and satisfying.

• Godot 3d Scenes

  by @MRCalderon3D

  Compose Godot 3D scenes with sound Node3D structure, cameras, physics bodies, environment ownership, and 3D performance patterns.

• Godot Resource Management

  by @MRCalderon3D

  Manage Godot resources, scenes, and imported assets so references, loading, and sharing behavior remain safe and efficient.

• Input Abstraction

  by @MRCalderon3D

  Design input around player intent and supported device families instead of hardcoding device-specific behavior everywhere.

• Ui Asset Pipeline

  by @MRCalderon3D

  Define import, 9-slice, atlas packing, theming, and naming rules for UI visual assets (buttons, panels, icons, bars).

• Animation State Patterns

  by @MRCalderon3D

  Structure animation state, blending, events, and sync so authored motion remains reliable under gameplay pressure.

• Godot Editor Tooling

  by @MRCalderon3D

  Create Godot editor tools, inspectors, import helpers, and validation flows that reduce manual authoring risk.

• Cinematic Pipeline

  by @MRCalderon3D

  Plan and implement cinematic content without breaking gameplay flow, performance, or content maintainability.

• Core Loop Design

  by @MRCalderon3D

  Define the primary player activity loop and the support loops that sustain mastery, variety, and progression.

• Ui Hud Patterns

  by @MRCalderon3D

  Structure HUD and menu implementation so UI remains understandable, maintainable, and aligned with UX goals.

• Godot Scene Architecture

  by @MRCalderon3D

  Structure scenes, nodes, autoloads, and resources so Godot projects remain scalable and understandable.

• Gameplay Architecture

  by @MRCalderon3D

  Define system ownership, boundaries, state flow, and extensibility for gameplay code across engines.

• Tilemap Pipeline

  by @MRCalderon3D

  Define tileset creation, auto-tile rules, collision shapes, and tilemap configuration for 2D levels.

• Art Bible

  by @MRCalderon3D

  Define a visual direction that artists, UI, technical art, and marketing can execute consistently.

• Audio Implementation

  by @MRCalderon3D

  Integrate music, SFX, VO, mixing, and reactive audio behavior so audio supports gameplay and UX.

• Godot Csharp Patterns

  by @MRCalderon3D

  Use C# in Godot with clear interop boundaries, node ownership, and engine lifecycle awareness.

• Ui Animation Pipeline

  by @MRCalderon3D

  Define transition, feedback, and state-driven animation rules for UI elements.

• Api Designer

  by @AIDotNet

  设计RESTful API并生成OpenAPI/Swagger规范文档，遵循行业最佳实践。包括端点命名、请求/响应模式和错误处理模式。

• 设计大师

  by @laborany

  LaborAny 设计大师——用 HTML 做高保真原型、交互 Demo、幻灯片、动画、设计变体探索 + 设计方向顾问 + 专家评审的一体化设计能力。HTML 是工具不是媒介，根据任务 embody 不同专家（UX 设计师 / 动画师 / 幻灯片设计师 / 原型师），避免 web design tropes。 触发场景：做原型、设计 Demo、交互原型、HTML 演示、动画 Demo、设计变体、hi-fi 设计、UI…

• Ppt Svg Generator

  by @laborany

  将 Markdown 文稿转化为可导入 PPT 的 SVG 页面。支持内容拆解、风格设计（5种预设+自定义+AI智能推荐）和批量生成。生成的 SVG 兼容 PPT「转换为形状」功能，可二次编辑。适用于演示文稿、方案汇报、知识分享等场景。

• 论文图表助手

  by @laborany

  智能图表生成助手，支持流程图、架构图、时序图等专业图表创建。 触发场景: (1) 用户需要创建流程图、架构图、时序图等 (2) 用户需要论文配图、技术文档插图 (3) 用户询问"帮我画个图"、"画个流程图"、"做个架构图" 支持: 论文配图、技术文档、演示汇报、教学材料等场景

• Hyva Cms Component

  by @hyva-themes

  Create custom Hyvä CMS component. This skill should be used when the user wants to create a new Hyvä CMS component, build a Hyvä component, or needs help with components.json and PHTML templates for Hyvä CMS. Trigger phrases…

• 公众号写作助手

  by @laborany

  微信公众号文章全流程创作技能。从选题构思到成稿排版的一站式写作助手，内置 Dan Koe 风格写作框架、AI痕迹智能去除、公众号专业排版输出。当用户需要撰写公众号文章、优化文章风格或排版输出时使用。

• Hyva Create Module

  by @hyva-themes

  Create a new Magento 2 module in app/code/. This skill should be used when the user wants to create a module, scaffold a new module, generate module boilerplate, or set up a custom module. It handles registration.php,…

• Hyva Theme List

  by @hyva-themes

  List all Hyvä theme paths in a Magento 2 project. This skill should be used when the user wants to find Hyvä themes, list available themes, discover theme paths, or when other skills need to locate Hyvä themes. Trigger phrases…

• Hyva Compile Tailwind Css

  by @hyva-themes

  Compile Tailwind CSS for Hyvä themes in Magento 2. Use when the user wants to build styles, generate CSS, compile Tailwind, run Tailwind, or create production/development stylesheets for a Hyvä theme. Also use when Tailwind…