Labsco

Agent Skills

Instruction packs that give your AI agent know-how. Three different kinds — pick the right one below.

UI Design

44 standalone skills
openai logo

liquid-glass

4,081

by openai

Implement and review macOS SwiftUI Liquid Glass UI. Use when adopting system glass, removing conflicting custom chrome, or building glass surfaces.

🔥🔥🔥✓ VerifiedFreeQuick setup
openai logo

figma-create-new-file

4,081

by openai

**MANDATORY prerequisite** — you MUST invoke this skill BEFORE every `create_new_file` tool call. NEVER call `create_new_file` directly without loading this skill first. Trigger whenever the user wants a new blank Figma file — a new design, FigJam, or Slides file — or when you need a fresh file before calling `use_figma`. Usage — /figma-create-new-file [editorType] [fileName] (e.g. /figma-create-new-file figjam My Whiteboard, /figma-create-new-file slides Q3 Review)

🔥🔥✓ VerifiedFreeQuick setup
openai logo

figma-code-connect

4,081

by openai

Creates and maintains Figma Code Connect template files that map Figma components to code snippets. Use when the user mentions Code Connect, Figma component mapping, design-to-code translation, or asks to create/update .figma.ts or .figma.js files.

🔥🔥🔥✓ VerifiedFreeQuick setup
openai logo

figma-generate-library

4,081

by openai

Build or update a professional-grade design system in Figma from a codebase. Use when the user wants to create variables/tokens, build component libraries, create individual components with proper variant sets and variable bindings, set up theming (light/dark modes), document foundations, or reconcile gaps between code and Figma. Also use when the user asks to create or generate any component in Figma — even a single one — since components require proper variable foundations, variant states, and

🔥🔥🔥🔥✓ VerifiedFreeQuick setup
browserbase logo

ui-test

3,623

by browserbase

AI-powered adversarial UI testing via the browse CLI. Analyzes git diffs to test only what changed, or explores the full app to find bugs. Tests functional correctness, accessibility, responsive layout, and UX heuristics. Use when the user asks to test UI changes, QA a pull request, audit accessibility, or run exploratory testing. Supports local browser (localhost) and remote Browserbase (deployed sites).

🔥🔥🔥🔥✓ VerifiedFreeQuick setup
microsoft logo

frontend-design-review

2,676

by microsoft

Review and create distinctive, production-grade frontend interfaces with high design quality and design system compliance. Evaluates using three pillars: frictionless insight-to-action, quality craft, and trustworthy building. USE FOR: PR reviews, design reviews, accessibility audits, design system compliance checks, creative frontend design, UI code review, component reviews, responsive design checks, theme testing, and creating memorable UI. DO NOT USE FOR: Backend API reviews, database schema

🔥🔥🔥🔥✓ VerifiedFreeQuick setup
WordPress logo

wpds

1,809

by wordpress

Use when building UIs leveraging the WordPress Design System (WPDS) and its components, tokens, patterns, etc.

🔥🔥🔥✓ VerifiedFreeQuick setup
inference-sh logo

chat-ui

584

by inference-sh

Chat UI building blocks for React/Next.js from ui.inference.sh. Components: container, messages, input, typing indicators, avatars. Capabilities: chat interfaces, message lists, input handling, streaming. Use for: building custom chat UIs, messaging interfaces, AI assistants. Triggers: chat ui, chat component, message list, chat input, shadcn chat, react chat, chat interface, messaging ui, conversation ui, chat building blocks

inference-sh logo

widgets-ui

584

by inference-sh

Declarative UI widgets from JSON for React/Next.js from ui.inference.sh. Render rich interactive UIs from structured agent responses. Capabilities: forms, buttons, cards, layouts, inputs, selects, checkboxes. Use for: agent-generated UIs, dynamic forms, data display, interactive cards. Triggers: widgets, declarative ui, json ui, widget renderer, agent widgets, dynamic ui, form widgets, card widgets, shadcn widgets, structured output ui

inference-sh logo

agent-ui

584

by inference-sh

Batteries-included agent component for React/Next.js from ui.inference.sh. One component with runtime, tools, streaming, approvals, and widgets built in. Capabilities: drop-in agent, human-in-the-loop, client-side tools, form filling. Use for: building AI chat interfaces, agentic UIs, SaaS copilots, assistants. Triggers: agent component, agent ui, chat agent, shadcn agent, react agent, agentic ui, ai assistant ui, copilot ui, inference ui, human in the loop

inference-sh logo

tools-ui

584

by inference-sh

Tool lifecycle UI components for React/Next.js from ui.inference.sh. Display tool calls: pending, progress, approval required, results. Capabilities: tool status, progress indicators, approval flows, results display. Use for: showing agent tool calls, human-in-the-loop approvals, tool output. Triggers: tool ui, tool calls, tool status, tool approval, tool results, agent tools, mcp tools ui, function calling ui, tool lifecycle, tool pending

github logo

spark-app-template

313

by github

Comprehensive guidance for building web apps with opinionated defaults for tech stack, design system, and code standards. Use when user wants to create a new web application, dashboard, or interactive interface. Provides tech choices, styling guidance, project structure, and design philosophy to get users up and running quickly with a fully functional, beautiful web app.

🔥🔥🔥✓ VerifiedFreeQuick setup
Automattic logo

wpds

207

by automattic

Use when building UIs leveraging the WordPress Design System (WPDS) and its components, tokens, patterns, etc.

🔥🔥🔥✓ VerifiedFreeQuick setup
firecrawl logo

wpds

3

by firecrawl

Use when building UIs leveraging the WordPress Design System (WPDS) and its components, tokens, patterns, etc.

🔥🔥FreeQuick setup
← PrevPage 2 of 2