Design AI agent skills

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

• Solid

  by @openclaw

  Write, port, review, or test Solid 2 UI in OpenClaw (Control UI, plugin views, Canvas hosts), including state ownership, Lit interop during the migration, native overlays, testing, performance, and lessons learned.

• Diagram Maker

  by @openclaw

  Create SVG/HTML or Excalidraw diagrams for concepts, architecture, flows, and whiteboards.

• Canvas

  by @openclaw

  Present hosted widget documents on a connected macOS panel and control panel visibility or navigation.

• Grill With Docs

  by @mattpocock

  A relentless interview to sharpen a plan or design, which also creates docs (ADR's and glossary) as we go.

• Grill Me

  by @mattpocock

  A relentless interview to sharpen a plan or design.

• Brand Discovery

  by @affaan-m

  Use when a brand needs to discover or articulate its identity through structured multi-session interviews. Covers purpose, positioning, audience, personality, voice, narrative, and founder-brand tension across 8 modules using…

• Frontend Slides

  by @affaan-m

  Create stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files. Use when the user wants to build a presentation, convert a PPT/PPTX to web, or create slides for a talk/pitch. Helps…

• Competitive Platform Analysis

  by @affaan-m

  Use when scoping a competitive landscape — identifying, categorising, and score-filtering a competitor set before any benchmarking begins. Decides who counts as a competitor, which tier they belong to, and which sources to mine.…

• Plan Canvas

  by @affaan-m

  Open plans and HTML artifacts in a local browser canvas where the human annotates elements, chats, and approves or requests changes without leaving the page. Use when presenting a plan for review, or when feedback like "move…

• Teach

  by @mattpocock

  Teach the user a new skill or concept, within this workspace.

• Improve Codebase Architecture

  by @mattpocock

  Scan a codebase for deepening opportunities, present them as a visual HTML report, then grill through whichever one you pick.

• Grilling

  by @mattpocock

  Grill the user relentlessly about a plan, decision, or idea. Use when the user wants to stress-test their thinking, or uses any 'grill' trigger phrases.

• Api Design

  by @affaan-m

  Patrones de diseño REST API incluyendo nomenclatura de recursos, códigos de estado, paginación, filtrado, respuestas de error, versionado y rate limiting para APIs de producción.

• Accessibility

  by @affaan-m

  WCAG 2.2 レベル AA 標準を用いてインクルーシブなデジタルプロダクトを設計・実装・監査します。Web 用のセマンティック ARIA および Web・ネイティブプラットフォーム（iOS/Android）のアクセシビリティトレイトを生成するために使用します。

• Auteur

  by @NousResearch

  Design and build cinematic, award-level web pages.

• Concept Diagrams

  by @NousResearch

  Generate flat, minimal educational SVG visuals as HTML.

• Mono Color

  by @NousResearch

  Generate one- or two-ink editorial print poster images.

• Hyperframes

  by @NousResearch

  Render MP4/WebM videos from HTML compositions.

• Pretext

  by @NousResearch

  Build creative browser demos with DOM-free text layout.

• Tldraw Offline

  by @NousResearch

  Drive and script tldraw offline canvases with an agent.

• Archify

  by @NousResearch

  Validated interactive HTML diagrams, upstream-maintained.

• Sketch

  by @NousResearch

  Throwaway HTML mockups: 2-3 design variants to compare.

• Ip As Logo

  by @NousResearch

  Design minimal cute IP mascot marks readable at 32px.

• Canvas Design

  by @anthropics

  Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never…

• Web Artifacts Builder

  by @anthropics

  Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui…

• Brand Guidelines

  by @anthropics

  Applies Anthropic's official brand colors and typography to any sort of artifact that may benefit from having Anthropic's look-and-feel. Use it when brand colors or style guidelines, visual formatting, or company design…

• Frontend Design

  by @anthropics

  Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.

• Agent Development

  by @anthropics

  This skill should be used when the user asks to "create an agent", "add an agent", "write a subagent", "agent frontmatter", "when to use description", "agent examples", "agent tools", "agent colors", "autonomous agent", or needs…

• Skill Development

  by @anthropics

  This skill should be used when the user wants to "create a skill", "add a skill to plugin", "write a new skill", "improve skill description", "organize skill content", or needs guidance on skill structure, progressive…

• Docs Diagrams

  by @vercel

  Draw diagrams for the Next.js docs in the style of the ones already published there: the light/dark PNGs an mdx references with `<Image srcLight="/docs/light/<name>.png" srcDark="/docs/dark/<name>.png">`. Use when a guide or API…

• Ponytail

  by @DietrichGebert

  Forces the laziest solution that actually works, simplest, shortest, most minimal. Channels a senior dev who has seen everything: question whether the task needs to exist at all (YAGNI), reach for the standard library before…

• Autoplan

  by @garrytan

  Auto-review pipeline — reads the full CEO, design, eng, and DX review skills from disk and runs them sequentially with auto-decisions using 6 decision principles. (gstack)

• Design Html

  by @garrytan

  Design finalization: generates production-quality Pretext-native HTML/CSS. (gstack)

• Office Hours

  by @garrytan

  YC Office Hours — two modes. (gstack)

• Design Consultation

  by @garrytan

  Design consultation: understands your product, researches the landscape, proposes a complete design system (aesthetic, typography, color, layout, spacing, motion), and generates font+color preview... (gstack)

• Design Shotgun

  by @garrytan

  Design shotgun: generate multiple AI design variants, open a comparison board, collect structured feedback, and iterate. (gstack)

• Plan Design Review

  by @garrytan

  Designer's eye plan review — interactive, like CEO and Eng review. (gstack)

• Diagram

  by @garrytan

  Turn an English description (or mermaid source) into a diagram triplet: the source, an editable .excalidraw file you can open on excalidraw.com, and rendered SVG + PNG. (gstack)

• Ui Ux Pro Max

  by @nextlevelbuilder

  UI/UX design intelligence for web, mobile, and desktop. This skill should be used when designing, building, reviewing, or fixing interfaces, including pages, components, design systems, accessibility, interaction, responsive…

• Design

  by @nextlevelbuilder

  Comprehensive design skill: brand identity, design tokens, UI styling, logo generation (55 styles, Gemini, Atlas Cloud, or MuAPI AI), corporate identity program (50 deliverables, CIP mockups), HTML presentations (Chart.js),…

• Design System

  by @nextlevelbuilder

  Token architecture, component specifications, and slide generation. Three-layer tokens (primitive→semantic→component), CSS variables, spacing/typography scales, component specs, strategic slide creation. Use for design tokens,…

• Brand

  by @nextlevelbuilder

  Brand voice, visual identity, messaging frameworks, asset management, brand consistency. Activate for branded content, tone of voice, marketing assets, brand compliance, style guides.

• Ui Styling

  by @nextlevelbuilder

  Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-based visual designs. Use when building user interfaces, implementing design…

• Slides

  by @nextlevelbuilder

  Create strategic HTML presentations with Chart.js, design tokens, responsive layouts, copywriting formulas, and contextual slide strategies.

• Banner Design

  by @nextlevelbuilder

  Design banners for social media, ads, website heroes, creative assets, and print. Multiple art direction options with optional generated or supplied visuals. Actions: design, create, generate banner. Platforms: Facebook,…

• Imagegen

  by @openai

  Generate or edit raster images when the task benefits from AI-created bitmap visuals such as photos, illustrations, textures, sprites, mockups, or transparent-background cutouts. Use when Codex should create a brand-new image,…

• Shadcn

  by @shadcn-ui

  Manages shadcn components and projects — adding, searching, fixing, debugging, styling, and composing UI, including chat interfaces. Provides project context, component docs, and usage examples. Applies when working with…

• Rea Tool Design

  by @morluto

  Design or change REA investigation tools, CLI/MCP contracts, provider capabilities, and Evidence semantics.

• Angular Developer

  by @angular

  Generates Angular code and provides architectural guidance. Trigger when creating projects, components, services, or HTTP communication, or for best practices on reactivity (signals, linkedSignal, resource, httpResource), forms,…

• Aster Atelier

  by @nexu-io

  Use this template when the user wants an artistic creative-studio website with classical imagery, cobalt skies, elegant serif typography and cinematic scrolling.

• Html Ppt

  by @nexu-io

  For consulting delivery work: turn diagnosis, frameworks, and project work into a client-adoptable action plan. Built around the core query "consulting-final-deck", with engagement manager judgment, buyer-ready proof, and this…

• Hyperframes

  by @nexu-io

  Create video compositions, animations, title cards, overlays, captions, voiceovers, audio-reactive visuals, and scene transitions in HyperFrames HTML. Use when asked to build any HTML-based video content, add captions or…

• Open Design Landing

  by @nexu-io

  Produce a world-class single-page editorial landing site in the Atelier Zero visual language (Monocle / Apartamento / Études editorial collage) — the same aesthetic OpenDesign uses for its own marketing surface. The agent fills…

• Od Contribute

  by @nexu-io

  One-click contribution flow for OpenDesign (nexu-io/open-design) — even for non-coders. Pick one of four cards (ship a Skill or Design System you made with OD; translate docs; fix a typo / write a blog; report a bug), the agent…

• Ib Pitch Book

  by @nexu-io

  OpenDesign's investor pitch book: market map, moat, unit economics, and the ask — analyst-grade and diligence-ready. Built as a decision-grade fundraising pitch deck for growth-equity investors.

• Open Design Landing Deck

  by @nexu-io

  OpenDesign's brand-story deck for partners and press: why it exists, what it believes, and where design is going. Built as a decision-grade marketing & GTM deck for partners, press, community.

• Trading Analysis Dashboard Template

  by @nexu-io

  Professional trading analysis dashboard template (single-file HTML) with light/dark theme switch, dense market panels, chart interactions, demo/live playback, and command palette behavior. Use when users ask for a…

• Html Ppt Zhangzara Stencil Tablet

  by @nexu-io

  A workplace-safety compliance review for a manufacturing regulator — findings, the evidence chain, and the corrective mandate. Built as a decision-grade policy briefing deck for regulator, plant leadership.

• Html Ppt Zhangzara Soft Editorial

  by @nexu-io

  A digital-transformation roadmap for a legacy insurer — the diagnosis, the sequenced bets, and the operating rhythm to land them. Built as a decision-grade consulting deck for client executives.

• Html Ppt Zhangzara Vellum

  by @nexu-io

  A humanities lecture: how Renaissance linear perspective reshaped early cartography — sources, argument, and evidence. Built as a decision-grade academic research deck for faculty, graduate seminar.

• Html Ppt Zhangzara Signal

  by @nexu-io

  OpenDesign's strategy memo: should it monetize the plugin registry now or hold — options, risks, and the recommendation. Built as a decision-grade corporate strategy deck for CEO, strategy team.

• Html Ppt Zhangzara Studio

  by @nexu-io

  A photography studio's portfolio-and-rate deck — the signature work, the process, and the packages that win the brief. Built as a decision-grade design craft deck for prospective clients.

• Orbit General

  by @nexu-io

  Open Orbit briefing skill — selected by the Orbit pipeline when the user has two or more connectors connected. Pulls the past 24 hours of activity from every authenticated connector (GitHub, Linear, Notion, Slack, 飞书, Calendar,…

• Sprite Animation

  by @nexu-io

  A pixel / sprite-style animated explainer slide — full-bleed cream stage, bold display year, animated pixel-art mascot (e.g. Hanafuda card, mushroom, or 8-bit console), kinetic Japanese display type, ticking timeline ribbon.…

• Social Media Dashboard

  by @nexu-io

  Creator-facing social media analytics dashboard in a single HTML file. A platform switcher (X / LinkedIn / YouTube / Instagram), a row of KPI cards (followers, engagement rate, likes, reposts), a follower-growth chart, a "top…

• Orbit Gmail

  by @nexu-io

  Open Orbit briefing skill — selected by the Orbit pipeline when Gmail is the user's only connected connector, or when the user explicitly scopes their daily digest to Gmail. Pulls the past 24 hours of inbox activity (replies…

• Orbit Notion

  by @nexu-io

  Open Orbit briefing skill — selected by the Orbit pipeline when Notion is the user's only connected connector, or when the user explicitly scopes their daily digest to Notion. Pulls the past 24 hours of document edits, comments,…

• Orbit Github

  by @nexu-io

  Open Orbit briefing skill — selected by the Orbit pipeline when GitHub is the user's only connected connector, or when the user explicitly scopes their daily digest to GitHub. Pulls the past 24 hours of PRs, review requests,…

• Orbit Linear

  by @nexu-io

  Open Orbit briefing skill — selected by the Orbit pipeline when Linear is the user's only connected connector, or when the user explicitly scopes their daily digest to Linear. Pulls the past 24 hours of issue movement, status…

• Social Carousel

  by @nexu-io

  A three-card social-media carousel laid out as 1080×1080 squares — three cinematic, on-brand panels with display headlines that connect across the series ("onwards." → "to the next one." → "looking ahead."). Each card has a…

• Kami Landing

  by @nexu-io

  Produce a print-grade single-page kami (紙 / 纸) document — warm parchment canvas, ink-blue accent, serif at one weight, no italic, no cool grays. The output reads like a professional white paper or studio one-pager, not an app…

• Image Poster

  by @nexu-io

  Single-image generation skill for posters, key art, and editorial illustrations. Defaults to gpt-image-2 but is provider-agnostic — the same workflow drives Flux, Imagen, or Midjourney via the active upstream tooling. Output is…

• Team Okrs

  by @nexu-io

  OKR tracker page — quarter banner, three objectives with their key results as progress bars, owner avatars, status pills, and a "this quarter at a glance" sidebar. Use when the brief mentions "OKRs", "key results", "objectives",…

• Saas Landing

  by @nexu-io

  Single-page SaaS landing with hero, features, social proof, pricing, and CTA. Respects the active DESIGN.md color/typography/layout tokens. Trigger keywords: "saas landing", "marketing page", "product landing".

• Kami Deck

  by @nexu-io

  A lab-meeting deck on gut-microbiome links to sleep quality — the design, the results, the caveats, and the next experiment. Built as a decision-grade academic research deck for lab group, PI.

• Pricing Page

  by @nexu-io

  A standalone pricing page — header, plan tiers, feature comparison table, and an FAQ. Use when the brief asks for "pricing", "plans", "subscription tiers", or a "compare plans" page.

• Magazine Web Ppt

  by @nexu-io

  For marketing and gtm work: bind launches, campaigns, events, and brand plans to growth and pipeline outcomes. Built around the core query "annual-marketing-plan", with GTM strategy lead judgment, buyer-ready proof, and this…

• Github Dashboard

  by @nexu-io

  GitHub repository analytics dashboard — stars, forks, contributors, issues, pull requests, recent activity, and top contributors. Use when the brief asks for a GitHub repo dashboard, open-source growth report, repository health…

• Html Ppt Zhangzara Pin And Paper

  by @nexu-io

  A field-biology capstone on urban pollinator decline — the survey design, the data, the contribution, and the caveats. Built as a decision-grade coursework defense deck for faculty reviewers.

• Flowai Live Dashboard Template

  by @nexu-io

  Team-management dashboard skill in the FlowAI aesthetic — three tabs (Team Members, Team Details, Activity Log), KPI stat row, member table, role distribution bar chart, online presence and activity sparklines, and a…

• Html Ppt Zhangzara Peoples Platform

  by @nexu-io

  A public-transit funding proposal for a city council — ridership need, the plan, the risk controls, and the ask. Built as a decision-grade policy briefing deck for city council, public board.

• Html Ppt Zhangzara Creative Mode

  by @nexu-io

  A brand visual-identity system reveal for an outdoor label — logo, color, type, and the rules that keep it consistent. Built as a decision-grade design craft deck for brand team, client.

• Html Ppt Zhangzara Pink Script

  by @nexu-io

  A wedding-anniversary tribute photo essay — a decade in scenes, the turning points, and the quiet meaning of staying. Built as a decision-grade story deck for couple, family, friends.

• Html Ppt Zhangzara Editorial Tri Tone

  by @nexu-io

  A type-and-color system for a culture magazine relaunch — the grid, the tri-tone palette, and the layout kit. Built as a decision-grade design craft deck for editorial & design team.

• Html Ppt Zhangzara Neo Grid Bold

  by @nexu-io

  A designer's portfolio narrative for a senior interview — three case studies, the craft, and the judgment behind each. Built as a decision-grade career deck for hiring panel.

• Html Ppt Zhangzara Playful

  by @nexu-io

  A retail sales-floor training on consultative selling — the flow, the role-plays, and the daily habit that lifts conversion. Built as a decision-grade professional training deck for store associates, floor managers.

• Html Ppt Zhangzara Mat

  by @nexu-io

  A margin-recovery diagnosis for a regional grocery chain — the governing thought, the driver tree, the priorities, and the roadmap. Built as a decision-grade consulting deck for client sponsor, steering committee.

• Html Ppt Zhangzara Cartesian

  by @nexu-io

  An economics senior thesis on the employment effects of local minimum-wage increases — identification strategy, evidence, and limitations. Built as a decision-grade coursework defense deck for thesis committee.

• Html Ppt Zhangzara Coral

  by @nexu-io

  OpenDesign's community-growth campaign across GitHub, Discord, and X: the loops, the content calendar, and the pipeline math. Built as a decision-grade marketing & GTM deck for growth team, community lead.

• Html Ppt Zhangzara Daisy Days

  by @nexu-io

  A customer-success workshop onboarding users to a project-management app — the first-value path and the habits that retain. Built as a decision-grade professional training deck for new customers, CS team.

• Html Ppt Zhangzara Monochrome

  by @nexu-io

  A grant proposal on CRISPR base-editing for sickle-cell disease — the hypothesis, the approach, the milestones, and the risk. Built as a decision-grade academic research deck for grant review committee.

• Html Ppt Zhangzara Grove

  by @nexu-io

  A municipal urban-tree-canopy policy proposal — the public need, the evidence, the options, and the funding decision. Built as a decision-grade policy briefing deck for city council, agency reviewers.

• Html Ppt Zhangzara Broadside

  by @nexu-io

  OpenDesign's product-launch announcement and press narrative — the headline, the proof points, and the call to action. Built as a decision-grade marketing & GTM deck for press, community, prospects.

• Html Ppt Zhangzara Cobalt Grid

  by @nexu-io

  OpenDesign renewal + seat-expansion business case for a growing customer: realized value, usage proof, and the expansion ROI. Built as a decision-grade B2B sales deck for champion, finance approver.

• Html Ppt Zhangzara Scatterbrain

  by @nexu-io

  A design-school graduation project: a civic wayfinding system for a transit hub — the brief, the process, and the outcome. Built as a decision-grade coursework defense deck for crit panel, faculty.

• Html Ppt Zhangzara Block Frame

  by @nexu-io

  Rescuing a messy startup deck into a board-grade system — the diagnosis, the page grammar, and the rebuilt proof pages. Built as a decision-grade design craft deck for founders, exec presenter.

• Html Ppt Zhangzara Retro Windows

  by @nexu-io

  An IT security-awareness training on spotting phishing — the tells, the drill, and what to do in the first 60 seconds. Built as a decision-grade professional training deck for all employees.

• Html Ppt Zhangzara Raw Grid

  by @nexu-io

  A brutalist poster-series case study for a music festival — the concept, the system, and how it scaled across formats. Built as a decision-grade design craft deck for design peers, client.

• Html Ppt Zhangzara Sakura Chroma

  by @nexu-io

  A cherry-blossom-season travel photo essay through Kyoto — the arrival, the peak bloom, and the moment that made the trip. Built as a decision-grade story deck for friends, travel readers.

• Html Ppt Zhangzara Capsule

  by @nexu-io

  A year-end self-review for a product manager — the role, the outcomes, the learning, and the ask, all evidence-backed. Built as a decision-grade career deck for manager, review committee.