KitScout

Categories › Software Development

See all Software Development tools →

Frontend, UI components & design-to-code

1,454 agent tools in this category, ranked by GitHub stars for now. Hands-on test results will replace this ranking as they finish.

Starter kit Draft

The three most-starred tools here. Not tested together yet.

frontend-design

Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making ch

npx skills add anthropics/skills --skill frontend-design
web-artifacts-builder

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

npx skills add anthropics/skills --skill web-artifacts-builder
frontend-ui-engineering

Builds production-quality, accessible, responsive user-facing UIs. Use when building or modifying interfaces and pages, creating components, implementing layout

npx skills add addyosmani/agent-skills --skill frontend-ui-engineering

All tools

Works with
Type
Publisher
Runs
Status
Access
ToolStarsLast updateLicense
frontend-design
Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and
SkillOfficial · AnthropicInstall · skills CLI
194,2187 days ago—
web-artifacts-builder
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui
SkillOfficial · AnthropicInstall · skills CLI
194,2187 days ago—
frontend-ui-engineering
Builds production-quality, accessible, responsive user-facing UIs. Use when building or modifying interfaces and pages, creating components, implement
SkillInstall · skills CLI
117,221todayMIT
dashboard-chat-best-practices
Apply dashboard-grade chat UX patterns in the Eve chat template. Use when changing Next.js Cache Components/PPR behavior, static shell layout, Suspens
SkillInstall · skills CLI
116,897todayApache-2.0
design-taste-frontend
tasteskill 2.5.1, the anti-slop frontend skill. Builds professional company websites at the level of figma.com and x.ai: plain copy in a voice of its
SkillInstall · skills CLI
115,1565 days agoMIT
design-critique
Give a structured product design critique — user job clarity, hierarchy, affordance, error states, accessibility, and consistency — focused on what to
SkillInstall · skills CLI
113,505todayMIT
directions-lab
Scaffold a directions lab that shows shipped UI (Today) beside 2-3 design directions, with surface tabs, theme and animation toggles and the V1 MVP ho
SkillInstall · skills CLI
113,505todayMIT
wireframe
Produce low-fidelity black-and-white UI wireframes as SVGs or viewer pages. Use when asked to wireframe, sketch a screen, draft a layout, make a low-f
SkillInstall · skills CLI
113,505todayMIT
impeccable
Use when the user wants to design, redesign, shape, critique, audit, polish, simplify, harden, animate, or otherwise improve a frontend interface: web
SkillInstall · skills CLI
109,741todayApache-2.0
impeccable
Use to design, redesign, critique, audit, polish or animate a frontend: websites, landing pages, dashboards, app UI, components, native iOS/Android sc
SkillInstall · skills CLI
109,741todayApache-2.0
critique
Run a 5-dimension expert design review on any HTML artifact in the project — Philosophy / Visual hierarchy / Detail / Functionality / Innovation, each
SkillInstall · skills CLI
107,550todayApache-2.0
critique-theater
Five-dimension design quality review — score the artifact against craft, brand, accessibility, and copy, then fix what falls short before handing it o
SkillInstall · skills CLI
107,550todayApache-2.0
design-brief
Parse a structured design brief written in I-Lang protocol format into a concrete design spec. Eliminates ambiguity from vague requests like "make it
SkillInstall · skills CLI
107,550todayApache-2.0
direction-picker
Resolves the visual direction at the plan stage from the brief and design system, without asking the user.
SkillInstall · skills CLI
107,550todayApache-2.0
frontend-slides
OpenDesign as a worked AI-workflow example: how local agents read your files and design on your desktop — concretely. Built as a decision-grade AI lit
SkillInstall · skills CLI
107,550todayApache-2.0
fs-electric-studio
OpenDesign as an enterprise design platform: a buyer-forwardable proposal for a design-org's economic buyer — pain, value, ROI, rollout. Built as a de
SkillInstall · skills CLI
107,550todayApache-2.0
huashu-bento-insight
OpenDesign vs closed cloud design tools: a side-by-side displacement case on control, cost (BYOK), and lock-in. Built as a decision-grade B2B sales de
SkillInstall · skills CLI
107,550todayApache-2.0
Front-End Checklist
Review frontend code and live pages against 386 quality-gated web development rules.
MCP serverGitHub-verified authorRemote● LiveFree to try
74,71414 days agoMIT
animate
Build an animation from scratch, making the decisions in the order that determines whether it feels right — should it animate at all, what purpose, wh
SkillInstall · skills CLI
56,728todayMIT
animate-expo
Build animations in React Native and Expo, making the decisions in the order that determines whether they feel right — should it animate, which thread
SkillInstall · skills CLI
56,728todayMIT
animation-performance
Keep web animations inside the frame budget — animate composite-only properties, keep motion off the main thread when the page is busy, and find the c
SkillInstall · skills CLI
56,728todayMIT
animation-vocabulary
Reverse-lookup glossary that turns a vague description of a web animation or motion effect into its exact term ("the bouncy thing when a popover opens
SkillInstall · skills CLI
56,728todayMIT
apple-design
Apple's approach to interface design and fluid, physical motion, translated for the web. Use when building or reviewing gesture-driven UI, spring anim
SkillInstall · skills CLI
56,728todayMIT
ask-sonner
Guide to Sonner, the React toast library — install and wire up the Toaster, pick the right toast() call, promise and loading toasts, updating, dismiss
SkillInstall · skills CLI
56,728todayMIT
break-ui
Try to break a piece of UI by feeding it worst-case data — long names, unbreakable emails, one-letter names, missing fields, huge counts, zero items,
SkillInstall · skills CLI
56,728todayMIT
choreograph
Coordinate several elements that animate together — decide what moves, in what order, how much they overlap, and what stays still — so a group reads a
SkillInstall · skills CLI
56,728todayMIT
emil-design-eng
Emil Kowalski's design-engineering philosophy for UI polish, component design, animation decisions, and the invisible details that make software feel
SkillInstall · skills CLI
56,728todayMIT
find-animation-opportunities
Search a codebase or UI for places that don't animate but should, and reject everything that shouldn't. Read-only; it proposes motion with exact value
SkillInstall · skills CLI
56,728todayMIT
gestures
Build drag, swipe, and sheet interactions that track the finger 1:1 and stay interruptible. Use when building or fixing anything the user drags, swipe
SkillInstall · skills CLI
56,728todayMIT
improve-animations
Survey a codebase's animation and motion code as a senior motion advisor, then produce a prioritized audit and self-contained implementation plans for
SkillInstall · skills CLI
56,728todayMIT
mobile-native
Make a web app feel native on a phone — the small CSS and meta-tag fixes that separate "a website in a browser" from something that feels installed. C
SkillInstall · skills CLI
56,728todayMIT
pick-ui-library
Pick the library for a frontend task from a curated list — primitives, toasts, drawers, command menus, OTP, numbers, charts, virtualization, drag and
SkillInstall · skills CLI
56,728todayMIT
prototype
Build multiple genuinely different versions of a UI piece you describe, rendered behind a visual picker so you can flip through them live and promote
SkillInstall · skills CLI
56,728todayMIT
remove-animations
Find the animations an interface doesn't need and remove them — motion on keyboard actions, high-frequency surfaces, functional data, and decoration w
SkillInstall · skills CLI
56,728todayMIT
review-animations
Reviews animation and motion code against a high craft bar derived from Emil Kowalski's design engineering philosophy. Default to flagging; approval i
SkillInstall · skills CLI
56,728todayMIT
Chrome DevTools MCP
MCP server for Chrome DevTools
MCP serverGitHub-verified authorLocal · npm
55,1791 day agoApache-2.0
cherry-electron-dev
Develop, fix, profile, and test PRs in a tracked Cherry Studio Electron instance. Use for implementation, UI and interaction work, runtime debugging,
SkillInstall · skills CLI
53,498todayAGPL-3.0
vercel-react-best-practices
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React
SkillInstall · skills CLI
53,498todayAGPL-3.0
io.github.tldraw/tldraw
Draw and visually collaborate with your agents on tldraw's canvas.
MCP serverGitHub-verified authorRemote● LiveFree to try
51,407today—
expo-tailwind-setup
Set up Tailwind CSS v4 in Expo with react-native-css and NativeWind v5 for universal styling
SkillInstall · skills CLI
49,672todayMIT
flutter-expert
Master Flutter development with Dart 3, advanced widgets, and multi-platform deployment.
SkillInstall · skills CLI
49,672todayMIT
frontend-api-integration-patterns
Production-ready patterns for integrating frontend applications with backend APIs, including race condition handling, request cancellation, retry stra
SkillInstall · skills CLI
49,672todayMIT
frontend-design
Design and implement a distinctive frontend within the product’s existing brand, accessibility, performance and framework constraints.
SkillInstall · skills CLI
49,672todayMIT
hig-components-layout
Apple Human Interface Guidelines for layout and navigation components.
SkillInstall · skills CLI
49,672todayMIT
hig-components-system
Apple HIG guidance for system experience components: widgets, live activities, notifications, complications, home screen quick actions, top shelf, wat
SkillInstall · skills CLI
49,672todayMIT
multi-platform-apps-multi-platform
Build and deploy the same feature consistently across web, mobile, and desktop platforms using API-first architecture and parallel implementation stra
SkillInstall · skills CLI
49,672todayMIT
ui-from-screenshot
Turn a screenshot or mockup into matching UI with the project's own components, then compare the result side by side with the image and fix the differ
SkillInstall · skills CLI
49,672todayMIT
ui-review
Review UI code for design system compliance, accessibility, and best practices
SkillInstall · skills CLI
49,672todayMIT
ui-states
Design and build the UI states agents forget: first use, empty, loading, error, offline, no results, long content, permission denied and success.
SkillInstall · skills CLI
49,672todayMIT
cardputer-buddy
Iterate on the Cardputer-Adv MicroPython app bundle (Claude Buddy, Snake, Hello) after the device is already provisioned via m5-onboard. Use when the
SkillOfficial · AnthropicInstall · skills CLI
47,0641 day agoApache-2.0
frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Generates creative, polished code that avoids generic AI aesthetics
PluginAnthropic marketplace
47,0641 day agoApache-2.0
m5-onboard
End-to-end onboarding for a freshly-plugged-in M5Stack ESP32 device (Cardputer, Cardputer-Adv, Core, CoreS3, Stick) — detect on USB, flash UIFlow 2.0
SkillOfficial · AnthropicInstall · skills CLI
47,0641 day agoApache-2.0
angular-migration
Migrate from AngularJS to Angular using hybrid mode, incremental component rewriting, and dependency injection updates. Use when upgrading AngularJS a
SkillInstall · skills CLI
42,4955 days agoMIT
nextjs-app-router-patterns
Master Next.js 14+ App Router with Server Components, streaming, parallel routes, and advanced data fetching. Use when building Next.js applications,
SkillInstall · skills CLI
42,4955 days agoMIT
react-modernization
Upgrade React applications to latest versions, migrate from class components to hooks, and adopt concurrent features. Use when modernizing React codeb
SkillInstall · skills CLI
42,4955 days agoMIT
react-state-management
Master modern React state management with Redux Toolkit, Zustand, Jotai, and React Query. Use when setting up global state, managing server state, or
SkillInstall · skills CLI
42,4955 days agoMIT
tailwind-design-system
Build scalable design systems with Tailwind CSS v4, design tokens, component libraries, and responsive patterns. Use when creating component libraries
SkillInstall · skills CLI
42,4955 days agoMIT
visual-edit-precision
Use when making UI/frontend changes guided by visual context, when the user selects elements visually, draws annotations, or provides screenshots alon
SkillInstall · skills CLI
42,4955 days agoMIT
create-spring-boot-java-project
Create a new Spring Boot Java project (Maven or Gradle) from start.spring.io with sensible defaults for configuration, PostgreSQL, logging, security,
SkillInstall · skills CLI
41,140todayMIT
create-spring-boot-kotlin-project
Create Spring Boot Kotlin Project Skeleton
SkillInstall · skills CLI
41,140todayMIT
fluentui-blazor
Guide for using the Microsoft Fluent UI Blazor component library (Microsoft.FluentUI.AspNetCore.Components NuGet package) in Blazor applications. Use
SkillInstall · skills CLI
41,140todayMIT
gsap-framer-scroll-animation
Use this skill whenever the user wants to build scroll animations, scroll effects, parallax, scroll-triggered reveals, pinned sections, horizontal scr
SkillInstall · skills CLI
41,140todayMIT
macos-golden-gate-design
Design, implement, review, or refactor native macOS 27 Golden Gate interfaces in SwiftUI or AppKit. Use when a Mac app must match Apple''s current mac
SkillInstall · skills CLI
41,140todayMIT
markstream-install
Install and configure Markstream streaming Markdown renderers for Vue, React, Svelte, Angular, Nuxt, and Vue 2 applications. Use for package selection
SkillInstall · skills CLI
41,140todayMIT
next-intl-add-language
Add new language to a Next.js + next-intl application
SkillInstall · skills CLI
41,140todayMIT
Next AI Draw.io
draw.io diagrams your AI agent draws on a live browser canvas that you can also edit by hand
MCP serverGitHub-verified authorLocal · npm
36,928todayApache-2.0
vercel-composition-patterns
React composition patterns that scale. Use when refactoring components with boolean prop proliferation, building flexible component libraries, or desi
SkillInstall · skills CLI
34,0341 day ago—
vercel-react-view-transitions
Guide for implementing smooth, native-feeling animations using React's View Transition API (`<ViewTransition>` component, `addTransitionType`, and CSS
SkillInstall · skills CLI
34,0341 day ago—
web-design-guidelines
Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "chec
SkillInstall · skills CLI
34,0341 day ago—
angular
Modern Angular (v20+) expert with deep knowledge of Signals, Standalone Components, Zoneless applications, SSR/Hydration, and reactive patterns.
SkillInstall · skills CLI
33,495todayMIT
avalonia-layout-zafiro
Guidelines for modern Avalonia UI layout using Zafiro.Avalonia, emphasizing shared styles, generic components, and avoiding XAML redundancy.
SkillInstall · skills CLI
33,495todayMIT
design-to-code
Pixel-perfect Figma to React conversion using coderio. Generates production-ready code (TypeScript, Vite, TailwindCSS V4) with high visual fidelity. F
SkillInstall · skills CLI
33,495todayMIT
figma
Use the Figma MCP server to fetch design context, screenshots, variables, and assets from Figma, and to translate Figma nodes into production code. Tr
SkillInstall · skills CLI
33,495todayMIT
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 proje
SkillInstall · skills CLI
33,495todayMIT
mobile-design
Mobile-first design thinking and decision-making for iOS and Android apps. Touch interaction, performance patterns, platform conventions. Teaches prin
SkillInstall · skills CLI
33,495todayMIT
premium-web-design
Create premium, Awwwards-quality website designs as React (.jsx) components that look like they were built by a top-tier agency charging $50k+ per pro
SkillInstall · skills CLI
33,495todayMIT
tailwind-patterns
Tailwind CSS v4 principles. CSS-first configuration, container queries, modern patterns, design token architecture.
SkillInstall · skills CLI
33,495todayMIT
ui-design-system
UI design system toolkit for Senior UI Designer including design token generation, component documentation, responsive design calculations, and develo
SkillInstall · skills CLI
33,495todayMIT
ui-ux-pro-max
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter,
SkillInstall · skills CLI
33,495todayMIT
frontend-engineer
Pro frontend engineering discipline. Enforces build-test-verify workflow for every web project. Never declare done until the site is built, tested, re
SkillInstall · skills CLI
31,114todayMIT
feature-flags-architect
Use before adding, rolling out or retiring a feature flag or kill switch, or when flag debt piles up. Plans the rollout with rollout_planner.py, finds
SkillInstall · skills CLI
29,7731 day agoMIT
senior-frontend
Build and review React, Next.js, TypeScript or Tailwind frontends: components, scaffolding, performance and bundle size. Use whenever the user wants a
SkillInstall · skills CLI
29,7731 day agoMIT
figma-code-connect-components
Connects Figma design components to code components using Code Connect mapping tools. Use when user says "code connect", "connect this component to co
SkillInstall · skills CLI
28,73016 days ago—
winui-app
Bootstrap, develop, and design modern WinUI 3 desktop applications with C# and the Windows App SDK using official Microsoft guidance, WinUI Gallery pa
SkillInstall · skills CLI
28,73016 days ago—
shadcn
Manages shadcn components and projects — adding, searching, fixing, debugging, styling, and composing UI, including chat interfaces. Provides project
SkillInstall · skills CLI
24,921today—
Coder
Manage Coder workspaces, templates, and cloud development environments
MCP serverGitHub-verified authorRemoteDown
17,3711 day agoAGPL-3.0
frontend-forge-fe-operations
Operate FrontendExtension (FE) resources in frontend-forge: create, update, rebuild, inspect package artifacts, download packages, publish, unpublish,
SkillInstall · skills CLI
17,0784 months ago—
frontend-forge-fi-operations
Operate FrontendIntegration resources and the frontend-forge extension. Use when Codex needs to create a FrontendIntegration from FrontendIntegration
SkillInstall · skills CLI
17,0784 months ago—
frontend-integration-yaml
Generate canonical FrontendIntegration YAML from a simplified single-menu authoring model for frontend-forge.
SkillInstall · skills CLI
17,0784 months ago—
io.github.GLips/Figma-Context-MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
MCP serverGitHub-verified authorLocal · npm
16,20118 days agoMIT
web-design-engineer
Build or redesign polished browser-rendered visual artifacts with HTML/CSS/JavaScript/React: pages, dashboards, prototypes, slide decks, animations, U
SkillInstall · skills CLI
15,0985 days agoMIT
frontend-dev
Full-stack frontend development combining premium UI design, cinematic animations, AI-generated media assets, persuasive copywriting, and visual art.
SkillInstall · skills CLI
13,8303 days agoMIT
fullstack-dev
Full-stack backend architecture and frontend-backend integration guide. TRIGGER when: building a full-stack app, creating REST API with frontend, scaf
SkillInstall · skills CLI
13,8303 days agoMIT
angular-architect
Generates Angular 17+ standalone components, configures advanced routing with lazy loading and guards, implements NgRx state management, applies RxJS
SkillInstall · skills CLI
12,3552 days agoMIT
nestjs-expert
Creates and configures NestJS modules, controllers, services, DTOs, guards, and interceptors for enterprise-grade TypeScript backend applications. Use
SkillInstall · skills CLI
12,3552 days agoMIT
nextjs-developer
Use when building Next.js 14+ applications with App Router, server components, or server actions. Invoke to configure route handlers, implement middle
SkillInstall · skills CLI
12,3552 days agoMIT
rails-expert
Rails 7+ specialist that optimizes Active Record queries with includes/eager_load, implements Turbo Frames and Turbo Streams for partial page updates,
SkillInstall · skills CLI
12,3552 days agoMIT
react-expert
Use when building React 18+ applications in .jsx or .tsx files, Next.js App Router projects, or create-react-app setups. Creates components, implement
SkillInstall · skills CLI
12,3552 days agoMIT
vue-expert
Builds Vue 3 components with Composition API patterns, configures Nuxt 3 SSR/SSG projects, sets up Pinia stores, scaffolds Quasar/Capacitor mobile app
SkillInstall · skills CLI
12,3552 days agoMIT
vue-expert-js
Creates Vue 3 components, builds vanilla JS composables, configures Vite projects, and sets up routing and state management using JavaScript only — no
SkillInstall · skills CLI
12,3552 days agoMIT
break
Renders a component you choose under every scenario that can reach it on a temporary page and stress tests it.
SkillInstall · skills CLI
12,1351 day agoMIT
build-design
Builds UI from a Figma file or a design image so it matches the design, using the project's existing tokens and components.
SkillInstall · skills CLI
12,1351 day agoMIT
state-machine
Renders every state of a component you choose on a throwaway page, with mock data and a switcher, so you can work on each state.
SkillInstall · skills CLI
12,1351 day agoMIT
variant
Builds multiple variants of a component you're working on and helps you iterate and pick one.
SkillInstall · skills CLI
12,1351 day agoMIT
baseline-ui
Quickly deslop UI code by fixing spacing, hierarchy, typography, and small layout issues. Use when the interface needs a fast cleanup or polish pass.
SkillInstall · skills CLI
11,0431 day agoMIT
component-canvas
Build a full-screen, interactive canvas to explore existing UI components and their variants with pan and zoom.
SkillInstall · skills CLI
11,0431 day agoMIT
create-canvas
Build a freeform canvas to explore, compare, and iterate on anything.
SkillInstall · skills CLI
11,0431 day agoMIT
create-design-md
Create or update a DESIGN.md from an existing product repository or public website. Use when asked to document an interface's design language, reconst
SkillInstall · skills CLI
11,0431 day agoMIT
fixing-motion-performance
Audit and fix animation performance issues including layout thrashing, compositor properties, scroll-linked motion, and blur effects. Use when animati
SkillInstall · skills CLI
11,0431 day agoMIT
improve-ui
Audit an existing product surface against its own design evidence, identify verified UI problems, and write self-contained implementation plans for an
SkillInstall · skills CLI
11,0431 day agoMIT
ui-skills-root
Use before UI-related work to select the smallest useful UI Skills context through the ui-skills CLI.
SkillInstall · skills CLI
11,0431 day agoMIT
adaptive
Instructions to make or update an app's UI so that it adapts to different Android devices including phones, tablets, foldables, laptops, desktop, TV,
SkillInstall · skills CLI
10,5033 days agoApache-2.0
display-glasses-with-jetpack-compose-glimmer
Provides guidelines for developing projected Android XR apps for display glasses using the Jetpack Compose Glimmer UI toolkit. Covers Glimmer design p
SkillInstall · skills CLI
10,5033 days agoApache-2.0
edge-to-edge
Use this skill to migrate your Jetpack Compose app to add adaptive edge-to-edge support and troubleshoot common issues. Use this skill to fix UI compo
SkillInstall · skills CLI
10,5033 days agoApache-2.0
glance-appwidget-updates-and-memory
Manages Android AppWidget state updates, background syncs, and RemoteViews bitmap memory limits with Jetpack Glance (androidx.glance:glance-appwidget)
SkillInstall · skills CLI
10,5033 days agoApache-2.0
glance-canonical-layouts
Use this skill to create home screen widgets using Jetpack Glance Canonical Layouts from the Android Platform Samples project, or when asked to implem
SkillInstall · skills CLI
10,5033 days agoApache-2.0
ink-app-builder
Adds inking and freehand drawing capabilities to an Android app using Jetpack Ink (androidx.ink) and Compose. Use this skill when implementing stylus
SkillInstall · skills CLI
10,5033 days agoApache-2.0
ink-custom-brush-builder
Creates custom BrushFamily definitions for an Android app using Jetpack Ink (androidx.ink 1.1.0-alpha03 and higher). Use this skill when configuring c
SkillInstall · skills CLI
10,5033 days agoApache-2.0
jetpack-compose-performance
Diagnose and optimize Android Jetpack Compose UI code. Use this skill when analyzing performance bottlenecks of existing code to minimize recompositio
SkillInstall · skills CLI
10,5033 days agoApache-2.0
leanback-to-compose-tv-migration
Provides instructions and architectural patterns for migrating Android TV applications from legacy Leanback UI Toolkit, Android Views, or Support Frag
SkillInstall · skills CLI
10,5033 days agoApache-2.0
projected-hardware
Provides instructions and workflows for accessing and managing hardware on Android XR projected devices, such as audio glasses and display glasses. Us
SkillInstall · skills CLI
10,5033 days agoApache-2.0
wear-compose-m3
Guidance for Wear OS Compose Material3 (Wear Compose Material 3 / Wear Compose Material3) watch and wearable apps. Covers creating, updating, and migr
SkillInstall · skills CLI
10,5033 days agoApache-2.0
wear-widgets
Create, migrate, update, and verify Wear OS widgets using Glance Wear and Remote Compose in an Android project. Use this skill when implementing Glanc
SkillInstall · skills CLI
10,5033 days agoApache-2.0
frontend-design
网页与数字界面设计师在构建Web页面或应用组件时,若受够了千篇一律的AI味设计,请用此技能。一键生成极具视觉冲击力、排版独特、动效惊艳的生产级前端代码,告别平庸,打造令人难忘的高品质数字界面。
SkillInstall · skills CLI
9,543today—
voltagent-awesome-design-md
73 个真实网站 DESIGN.md 提取集合(Claude / Cursor / Vercel / Stripe / Apple / Tesla / Ferrari ...)。 把 DESIGN.md 复制到项目根目录,AI agent 读 DESIGN.md 后能生成风格一致的高质量 UI。 本
SkillInstall · skills CLI
9,543today—
web-design-analyzer
网页与数字界面设计师和网页开发工程师在需要逆向分析网页截图时,使用本技能一键提取配色、排版及组件特征,自动生成结构化 Design System 数据与 AI Coding Prompt,让设计还原与前端开发更高效。
SkillInstall · skills CLI
9,543today—
modern-web-guidance
Keep your coding agent up to date with the latest web best practices
PluginAnthropic marketplace
9,4734 days agoApache-2.0
frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, a
SkillInstall · skills CLI
8,843todayApache-2.0
ui-mockup
Create UI mockups at three fidelity levels — ASCII wireframes for quick iteration, standalone HTML mockups for delivery with requirements, and live pr
SkillInstall · skills CLI
8,843todayApache-2.0
design-md
Analyze Stitch projects and synthesize a semantic design system into DESIGN.md files
SkillInstall · skills CLI
8,7712 months agoApache-2.0
react-vite-dashboard
Convert Stitch designs into production React + Vite dashboards with TanStack Query, accessible tokens from DESIGN.md, and Web3-ready patterns (ethers/
SkillInstall · skills CLI
8,7712 months agoApache-2.0
shadcn-ui
Expert guidance for integrating and building applications with shadcn/ui components, including component discovery, installation, customization, and b
SkillInstall · skills CLI
8,7712 months agoApache-2.0
stitch::code-to-design
Convert frontend code (Vite, React, Angular, Vue, etc.) to a Stitch Design by chaining static HTML extraction, design system extraction, and file uplo
SkillInstall · skills CLI
8,7712 months agoApache-2.0
stitch::extract-design-md
Extract a comprehensive design system (DESIGN.md) directly from frontend source code — React, Vue, Svelte, Angular, plain HTML/CSS, or any web framewo
SkillInstall · skills CLI
8,7712 months agoApache-2.0
stitch::extract-static-html
Extract self-contained static HTML from a built web application or React components by inlining CSS and images. Use this skill whenever you need to ca
SkillInstall · skills CLI
8,7712 months agoApache-2.0
stitch::generate-design
Generate new screens from text prompts or images, edit existing screens with prompts and design system tokens, and generate design variants using Stit
SkillInstall · skills CLI
8,7712 months agoApache-2.0
stitch::manage-design-system
Manage design systems in Stitch using MCP tools. Includes retrieval of assets, creating/updating design systems in Stitch, and applying them to screen
SkillInstall · skills CLI
8,7712 months agoApache-2.0
stitch::react-components
Converts Stitch designs into modular Vite and React components, or syncs/updates existing React components to align with the latest Stitch designs, us
SkillInstall · skills CLI
8,7712 months agoApache-2.0
stitch::upload-to-stitch
Upload local assets (images, mockups, extracted HTML, design markdown) to a Stitch project. ALWAYS use this skill when you need to upload visual asset
SkillInstall · skills CLI
8,7712 months agoApache-2.0
taste-design
Semantic Design System Skill for Google Stitch. Generates agent-friendly DESIGN.md files that enforce premium, anti-generic UI standards — strict typo
SkillInstall · skills CLI
8,7712 months agoApache-2.0
ui
Produces distinctive production UI and screenshot-grounded visual polish. Use when building or restyling pages, components, or typography. Not for bac
SkillInstall · skills CLI
7,5852 days agoMIT
agency-grid-layout-minimal
Create a minimal agency design system with a disciplined editorial grid, oversized typography, quiet uppercase utility labels, restrained image blocks
SkillInstall · skills CLI
7,4641 day agoMIT
animation-on-scroll
Create an on-scroll animation trigger using IntersectionObserver with Tailwind-friendly animation classes and keyframes. Use when asked for scroll-rev
SkillInstall · skills CLI
7,4641 day agoMIT
animation-systems
Use when designing or implementing product-grade web motion like Stripe, Linear, Apple, and Vercel. Covers motion principles, easing/duration defaults
SkillInstall · skills CLI
7,4641 day agoMIT
beam-glow-states
Create React loading, processing, selected, current, focus, and pressed states with the border-beam package's animated edge glow. Use when a card, but
SkillInstall · skills CLI
7,4641 day agoMIT
beautiful-shadows
Apply exact Tailwind arbitrary shadow utilities for polished, layered neutral elevation. Use when compact cards, controls, panels, popovers, hero medi
SkillInstall · skills CLI
7,4641 day agoMIT
blue-cloudy-clean-modern
Create a clean modern design system with a luminous blue sky atmosphere, soft drifting cloud light, minimal white framing, and serene premium typograp
SkillInstall · skills CLI
7,4641 day agoMIT
blue-laser-clean-glass-layout
Create a clean dark glass layout system with a thin blue laser atmosphere, frosted premium shells, and polished dashboard structure.
SkillInstall · skills CLI
7,4641 day agoMIT
book-serif-index
Create an archival book-reader design system with serif-led pages, mono index navigation, aged paper surfaces, margin notes, and a premium catalog fra
SkillInstall · skills CLI
7,4641 day agoMIT
bright-green-tech-system-webgl
Create a bright-green technical design system with structured split layouts, hard-framed dark surfaces, mono utility labels, and a prominent WebGL vis
SkillInstall · skills CLI
7,4641 day agoMIT
clean-minimal-beige-light-mode
Create a clean minimal beige light-mode design system with warm neutral shells, quiet process grids, restrained accent color, and elegant low-contrast
SkillInstall · skills CLI
7,4641 day agoMIT
design-first-ui-prompting
Use when you need design-first, spec-driven, skimmable prompts for UI generation. Covers prompt structure, constraints, variations, typography/spacing
SkillInstall · skills CLI
7,4641 day agoMIT
gsap
Use when you need to add or debug professional web animations with GSAP (timelines, ScrollTrigger, stagger, transforms) in HTML/CSS/JS/React. Includes
SkillInstall · skills CLI
7,4641 day agoMIT
high-contrast-skeuomorphic-clean
Create a high-contrast clean skeuomorphic design system with molded dark surfaces, crisp light separation, tactile inset depth, and restrained signal
SkillInstall · skills CLI
7,4641 day agoMIT
horizontal-scroll-scenes
Build scene-by-scene chapters that advance left to right on one fixed stage while the user scrolls vertically, with native scroll as the only input. O
SkillInstall · skills CLI
7,4641 day agoMIT
html-demo
Show an app working on a web page by drawing it live in HTML instead of recording it. A Mac-style window plays the app step by step, and every frame i
SkillInstall · skills CLI
7,4641 day agoMIT
image-first-grid-layout
Create an image-led grid design system with full-bleed photography, structural guide lines, anchored content blocks, and restrained technical overlays
SkillInstall · skills CLI
7,4641 day agoMIT
landing-page
Use when designing or rewriting a high-converting landing page (single-offer page) for SaaS/apps/services. Covers structure, layout patterns, conversi
SkillInstall · skills CLI
7,4641 day agoMIT
light-mode-paper-technical
Create a light-mode technical design system with warm paper surfaces, dark outer framing, subtle diagonal texture, precise bracketed geometry, and res
SkillInstall · skills CLI
7,4641 day agoMIT
liquid-metal-border
Add and tune animated liquid-metal WebGL borders with the React `metal-fx` package. Use when buttons, icon controls, chips, tabs, cards, or selected s
SkillInstall · skills CLI
7,4641 day agoMIT
marquee-loop
Apply seamless infinite marquee loops using duplicated items.
SkillInstall · skills CLI
7,4641 day agoMIT
masked-reveal
Create masked staggered word reveals on scroll with GSAP ScrollTrigger. Use when headings, hero copy, section titles, or editorial text should reveal
SkillInstall · skills CLI
7,4641 day agoMIT
matterjs
Use when implementing 2D physics interactions with Matter.js, including Engine/World setup, Render/Runner configuration, adding bodies and constraints
SkillInstall · skills CLI
7,4641 day agoMIT
mesh-gradient-dark-blue-clean
Create a futuristic, premium, clean dark-blue mesh-gradient design system across background rendering, hero shell, navigation, floating nodes, framed
SkillInstall · skills CLI
7,4641 day agoMIT
nested-container-clean-agency
Create a clean agency design system built from nested containers, with an outer editorial shell, inset dark feature blocks, rounded premium cards, and
SkillInstall · skills CLI
7,4641 day agoMIT
nested-container-frames
Create a container-in-container layout system using nested frames. Use an outer centered container with visible vertical boundary lines and corner mar
SkillInstall · skills CLI
7,4641 day agoMIT
no-ai-design-slop
Prevent and remove generic AI-generated design defaults, incoherent visual choices, and established UI defects while creating, revising, or reviewing
SkillInstall · skills CLI
7,4641 day agoMIT
number-details
Add decorative 01, 02, 03 numeric detail markers.
SkillInstall · skills CLI
7,4641 day agoMIT
operational-enterprise-ai
Create or redesign enterprise AI, automation, security, and operations product pages that explain system boundaries, approvals, auditability, exceptio
SkillInstall · skills CLI
7,4641 day agoMIT
optimize-web-animations
Profile, audit, and optimize frontend page performance with emphasis on animation work, memory-leak risks, long-session slowdowns, CSS animations, can
SkillInstall · skills CLI
7,4641 day agoMIT
orange-clean-paper-saas
Create a clean paper-toned SaaS design system with warm neutrals, orange accent signals, rounded premium forms, and polished product illustration surf
SkillInstall · skills CLI
7,4641 day agoMIT
paper-cinder-transition
Change between pages, chapters or scenes with a paper-burn transition, a ragged ember line that sweeps across the frame, chars the old page ahead of i
SkillInstall · skills CLI
7,4641 day agoMIT
pointer-trail-emitter
Build a cursor trail whose spacing stays constant at any hand speed, by emitting motes per unit of distance travelled rather than on a timer, so a fli
SkillInstall · skills CLI
7,4641 day agoMIT
pricing-page
Use when designing or rewriting a high-converting SaaS pricing page (structure, plan design, copywriting, SEO/AEO, FAQs, layout patterns, experiments)
SkillInstall · skills CLI
7,4641 day agoMIT
product-proof-saas
Create or redesign SaaS and AI product landing pages where a real workflow, interface, or deterministic demo is the central proof. Use for pale atmosp
SkillInstall · skills CLI
7,4641 day agoMIT
progressive-blur
Create a layered CSS progressive blur (top or bottom) using multiple backdrop-filter masks for depth and softness. Use when asked for “progressive blu
SkillInstall · skills CLI
7,4641 day agoMIT
reveal-hover-effect
Build cursor-following spotlight reveals that expose a second aligned image through a soft radial mask. Use for hover-to-color, before-and-after, x-ra
SkillInstall · skills CLI
7,4641 day agoMIT
scroll-progress-timeline
Turn any ordered process into a data-driven vertical or horizontal scroll story with a base line, progress fill, active step states, responsive collap
SkillInstall · skills CLI
7,4641 day agoMIT
scroll-scrubbed-visual-sequence
Build reversible scroll-controlled visual transformations with a pinned or sticky stage, normalized progress, and video, image-sequence, canvas, SVG,
SkillInstall · skills CLI
7,4641 day agoMIT
tailwindcss
Use when designing/implementing UI with Tailwind CSS (layout, typography, responsive, theming, component patterns). Includes quick recipes and convent
SkillInstall · skills CLI
7,4641 day agoMIT
figma-code-connect
Creates and maintains Figma Code Connect template files that map Figma components to code snippets. Use when the user mentions Code Connect, Figma com
SkillInstall · skills CLI
7,451today—
figma-create-new-file
**MANDATORY prerequisite** — you MUST invoke this skill BEFORE every `create_new_file` tool call. NEVER call `create_new_file` directly without loadin
SkillInstall · skills CLI
7,451today—
figma-design-to-code
Use this skill when implementing a Figma design as code (design → code) — the read-FROM-Figma direction. Triggers: 'implement this Figma design', 'bui
SkillInstall · skills CLI
7,451today—
figma-generate-diagram
MANDATORY prerequisite — load this skill BEFORE every `generate_diagram` tool call. NEVER call `generate_diagram` directly without loading this skill
SkillInstall · skills CLI
7,451today—
figma-generate-library
Build or update a professional-grade design system in Figma from a codebase. Use when the user wants to create variables/tokens, build component libra
SkillInstall · skills CLI
7,451today—
figma-implement-motion
Translates Figma motion and animations into production-ready application code. Use when implementing animation/motion from a Figma design — user menti
SkillInstall · skills CLI
7,451today—
figma-swiftui
SwiftUI ↔ Figma translation. Use whenever the user mentions Swift, SwiftUI, iOS, iPhone, or iPad — in EITHER direction — translating a Figma design in
SkillInstall · skills CLI
7,451today—
figma-use-figjam
This skill helps agents use Figma's use_figma MCP tool in the FigJam context. Can be used alongside figma-use which has foundational context for using
SkillInstall · skills CLI
7,451today—
figma-use-motion
Motion / animation context for the `use_figma` MCP tool — animating Figma nodes via manual keyframes, animation styles, easing, and timeline duration.
SkillInstall · skills CLI
7,451today—
figma-use-slides
This skill helps agents use Figma's use_figma MCP tool in the Slides context. Can be used alongside figma-use which has foundational context for using
SkillInstall · skills CLI
7,451today—
shadcn
Manages shadcn components and projects — adding, searching, fixing, debugging, styling, and composing UI. Provides project context, component docs, an
SkillInstall · skills CLI
7,451today—
figma
Use the Figma MCP server to fetch design context, screenshots, variables, and assets from Figma, and to translate Figma nodes into production code. Us
SkillInstall · skills CLI
7,1672 days ago—
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 proje
SkillInstall · skills CLI
7,1672 days ago—
frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, a
SkillInstall · skills CLI
7,1672 days ago—
web-design-guidelines
Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "chec
SkillInstall · skills CLI
7,1672 days ago—
com.xcodebuildmcp/XcodeBuildMCP
XcodeBuildMCP provides tools for Xcode project management, simulator management, and app utilities.
MCP serverVerified domain · xcodebuildmcp.comLocal · npm
6,5667 days agoMIT
preline-theme-generator
Generate, preview, save, or validate Preline theme CSS using the bundled local generator in this skill. Use when the user asks to create a new Preline
SkillInstall · skills CLI
6,5252 days ago—
baoyu-design
Create or edit visual design artifacts as self-contained HTML: UI mockups, interactive prototypes, wireframes, landing pages, dashboards, app screens,
SkillInstall · skills CLI
6,424today—
claude-data
Use this for a local, data-backed dashboard, metrics page, KPI tracker, scorecard, data visualization or recurring report that opens in the bundled li
SkillInstall · skills CLI
6,424today—
claude-design
Make and revise designs in the Design (canvas) artifact format (project/canvas.json plus one .dc.html Design Component file per artboard) as local fil
SkillInstall · skills CLI
6,424today—
claude-design-system
Create and revise design systems in the Design System artifact format (project/design-system.json, tokens.json, a README brand book, component preview
SkillInstall · skills CLI
6,424today—
dataviz
Use this skill whenever you are about to create ANY chart, graph, plot, dashboard, or data visualization, in ANY output medium (HTML/React artifact, i
SkillInstall · skills CLI
6,424today—
dotnet-maui-doctor
Diagnoses and fixes .NET MAUI development environment issues. Validates .NET SDK, workloads, Java JDK, Android SDK, Xcode, and Windows SDK. All versio
SkillInstall · skills CLI
6,155todayMIT
maui-app-lifecycle
.NET MAUI app lifecycle guidance — the four app states, cross-platform Window lifecycle events (Created, Activated, Deactivated, Stopped, Resumed, Des
SkillInstall · skills CLI
6,155todayMIT
maui-collectionview
Guidance for implementing CollectionView in .NET MAUI apps — data display, layouts (list & grid), selection, grouping, scrolling, empty views, templat
SkillInstall · skills CLI
6,155todayMIT
maui-data-binding
Guidance for .NET MAUI XAML and C# data bindings — compiled bindings, INotifyPropertyChanged / ObservableObject, value converters, binding modes, mult
SkillInstall · skills CLI
6,155todayMIT
maui-dependency-injection
Guidance for configuring dependency injection in .NET MAUI apps — service registration in MauiProgram.cs, lifetime selection (Singleton / Transient /
SkillInstall · skills CLI
6,155todayMIT
maui-safe-area
.NET MAUI safe area and edge-to-edge layout guidance for .NET 10+. Covers the new SafeAreaEdges property, SafeAreaRegions enum, per-edge control, keyb
SkillInstall · skills CLI
6,155todayMIT
maui-shell-navigation
Guide for implementing Shell-based navigation in .NET MAUI apps. Covers AppShell setup, visual hierarchy (FlyoutItem, TabBar, Tab, ShellContent), URI-
SkillInstall · skills CLI
6,155todayMIT
maui-theming
Guide for theming .NET MAUI apps — light/dark mode via AppThemeBinding, ResourceDictionary theme switching, DynamicResource bindings, system theme det
SkillInstall · skills CLI
6,155todayMIT
nitro
Nitro is the framework-agnostic server toolkit (powering Nuxt) for building and deploying web servers anywhere. Use when working with nitro.config, se
SkillInstall · skills CLI
6,0672 days agoMIT
nuxt
Nuxt full-stack Vue framework with SSR, auto-imports, and file-based routing. Use when working with Nuxt apps, server routes, useFetch, middleware, or
SkillInstall · skills CLI
6,0672 days agoMIT
pinia
Pinia official Vue state management library, type-safe and extensible. Use when defining stores, working with state/getters/actions, or implementing s
SkillInstall · skills CLI
6,0672 days agoMIT
unocss
UnoCSS instant atomic CSS engine, superset of Tailwind CSS. Use when configuring UnoCSS, writing utility rules, shortcuts, or working with presets lik
SkillInstall · skills CLI
6,0672 days agoMIT
vitepress
VitePress static site generator powered by Vite and Vue. Use when building documentation sites, configuring themes, or writing Markdown with Vue compo
SkillInstall · skills CLI
6,0672 days agoMIT
vue
Vue 3 Composition API, script setup macros, reactivity system, and built-in components. Use when writing Vue SFCs, defineProps/defineEmits/defineModel
SkillInstall · skills CLI
6,0672 days agoMIT
build-with-tinybase
Scaffold, extend, and verify reactive local-first JavaScript or TypeScript applications with TinyBase. Use when choosing TinyBase for in-memory tabula
SkillInstall · skills CLI
5,214todayMIT
appllama-app-design-skill
Build native-feeling, benchmark-quality mobile app screens (Expo / React Native). Use when designing or implementing any mobile UI — screens, flows, o
SkillInstall · skills CLI
5,1592 months agoMIT
appllama-usage
Use the Appllama MCP (mcp.appllama.io) well — research real top-grossing mobile apps, their screens, flows, and UI elements, then build from what you
SkillInstall · skills CLI
5,1592 months agoMIT
designlang-tokens
Use when styling UI for perplexity.ai — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for planetscale.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for posthog.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for postman.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for railway.app — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for ramp.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for raycast.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for render.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for replit.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for resend.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for retool.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for sentry.io — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for supabase.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for v0.dev — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
designlang-tokens
Use when styling UI for webflow.com — references the extracted design system tokens instead of inventing colors, spacing, or typography.
SkillInstall · skills CLI
5,0701 day agoMIT
localization-toolkit
This skill should be used when setting up, auditing, or enforcing internationalization/localization in UI codebases (React/TS, i18next or similar, JSO
SkillInstall · skills CLI
4,708todayMIT
nextjs-developer
Use when building Next.js 14+ applications with App Router, server components, or server actions. Invoke for full-stack features, performance optimiza
SkillInstall · skills CLI
4,708todayMIT
three-best-practices
Three.js performance optimization and best practices guidelines. Use when writing, reviewing, or optimizing Three.js code. Triggers on tasks involving
SkillInstall · skills CLI
4,708todayMIT
threejs-animation
Keyframe, skeletal and morph-target animation, procedural motion and clip blending, on WebGL or with WebGPU and TSL. Use when animating objects, playi
SkillInstall · skills CLI
4,17426 days agoMIT
threejs-asset-pipeline
Shrinking glTF assets for three.js with gltf-transform: inspect, validate and optimize commands, Draco, meshopt and quantization, KTX2, WebP and AVIF
SkillInstall · skills CLI
4,17426 days agoMIT
threejs-fundamentals
Three.js scene setup: scenes and fog, cameras, the renderer and tone mapping, the animation loop, object hierarchies, transforms, core math and cleanu
SkillInstall · skills CLI
4,17426 days agoMIT
threejs-geometry
Creating and shaping three.js geometry: built-in shapes, 3D text, vertex buffers and attributes, merging, instancing, batching, point clouds and lines
SkillInstall · skills CLI
4,17426 days agoMIT
threejs-interaction
Picking with raycasting, camera controls, transform gizmos, drag, hover and box selection for three.js, identical under WebGL and WebGPU. Use when han
SkillInstall · skills CLI
4,17426 days agoMIT
threejs-lighting
Light types and physical units, shadow maps, HDR environment lighting, light probes, and lighting performance, on WebGL or with WebGPU and TSL. Use wh
SkillInstall · skills CLI
4,17426 days agoMIT
threejs-loaders
Loading three.js assets: glTF with Draco, meshopt and KTX2 compression, other model formats, textures, HDR and EXR environments, progress, caching, cl
SkillInstall · skills CLI
4,17426 days agoMIT
threejs-materials
Choosing and configuring three.js materials - unlit, diffuse, specular, PBR, toon, point and line materials - shared properties like blending and sten
SkillInstall · skills CLI
4,17426 days agoMIT
threejs-performance
Measuring and optimizing three.js speed: render statistics, memory counters, fewer draw calls via merging, instancing, batching and LOD, fill rate, sh
SkillInstall · skills CLI
4,17426 days agoMIT
threejs-postprocessing
Three.js post-processing: composer pass chains, built-in renderer effects, and the WebGPU/TSL node pipeline — bloom, depth of field, ambient occlusion
SkillInstall · skills CLI
4,17426 days agoMIT
threejs-react-three-fiber
Building three.js scenes from React with React Three Fiber and drei: renderer setup, the scene graph as JSX, frame-loop, state and loading hooks, poin
SkillInstall · skills CLI
4,17426 days agoMIT
threejs-shaders
Custom GLSL vertex and fragment shaders: uniforms, varyings, shader chunks, extending built-in materials, instanced attributes, plus the same effects
SkillInstall · skills CLI
4,17426 days agoMIT
threejs-textures
Three.js textures: image loading, color spaces, UV channels and transforms, texture types from canvas to HDR and KTX2, render targets, texture memory.
SkillInstall · skills CLI
4,17426 days agoMIT
expo-animation
Build animations in React Native and Expo, making the decisions in the order that determines whether they feel right — should it animate, which thread
SkillInstall · skills CLI
4,131todayMIT
expo-data-fetching
Use when implementing or debugging ANY network request, API call, or data fetching. Covers fetch API, React Query, SWR, error handling, caching, offli
SkillInstall · skills CLI
4,131todayMIT
expo-design-system
Build and maintain a design system inside an Expo app - a reusable theme of design tokens (color, spacing, typography, radius, shadow, motion), reusab
SkillInstall · skills CLI
4,131todayMIT
expo-dom
Use Expo DOM components to run web code in a webview on native and as-is on web. Migrate web code to native incrementally. For the end-to-end migratio
SkillInstall · skills CLI
4,131todayMIT
macos-menubar-tuist-app
Build, refactor, or review macOS menubar apps that use Tuist and SwiftUI. Use when creating or maintaining LSUIElement menubar utilities, defining Tui
SkillInstall · skills CLI
4,0287 months agoMIT
macos-spm-app-packaging
Scaffold, build, and package SwiftPM-based macOS apps without an Xcode project. Use when you need a from-scratch macOS app layout, SwiftPM targets/res
SkillInstall · skills CLI
4,0287 months agoMIT
react-component-performance
Analyze and optimize React component performance issues (slow renders, re-render thrash, laggy lists, expensive computations). Use when asked to profi
SkillInstall · skills CLI
4,0287 months agoMIT
swiftui-liquid-glass
Implement, review, or improve SwiftUI features using the iOS 26+ Liquid Glass API. Use when asked to adopt Liquid Glass in new SwiftUI UI, refactor an
SkillInstall · skills CLI
4,0287 months agoMIT
swiftui-performance-audit
Audit and improve SwiftUI runtime performance from code review and architecture. Use for requests to diagnose slow rendering, janky scrolling, high CP
SkillInstall · skills CLI
4,0287 months agoMIT
swiftui-ui-patterns
Best practices and example-driven guidance for building SwiftUI views and components, including navigation hierarchies, custom view modifiers, and res
SkillInstall · skills CLI
4,0287 months agoMIT
swiftui-view-refactor
Refactor and review SwiftUI view files with strong defaults for small dedicated subviews, MV-over-MVVM data flow, stable view trees, explicit dependen
SkillInstall · skills CLI
4,0287 months agoMIT
Dembrandt
Design tokens from any live site: colours, type, spacing, components, drift against a baseline.
MCP serverGitHub-verified authorLocal · npm
4,01012 days agoMIT
fast-agent-design
Use this skill to generate well-branded interfaces and assets for fast-agent, either for production or throwaway prototypes/mocks/etc. Contains essent
SkillInstall · skills CLI
3,9673 days agoApache-2.0
g-assist-mcp-skill
Use this skill to check or change this machine's NVIDIA display and GPU settings, such as resolution, refresh rate, V-Sync, G-SYNC, brightness, color,
SkillInstall · skills CLI
3,9541 day agoApache-2.0
node-zombie-guardian
Use when diagnosing stale or orphaned Node.js processes launched by VCO, auditing ownership/liveness, or safely simulating cleanup without touching ex
SkillInstall · skills CLI
3,8164 days agoApache-2.0
scenario-maya-lighting-rendering
Use when lighting or rendering in Maya with Arnold: a product hero shot, a character close-up or a sequence (master and shot lighting), key, fill and
SkillInstall · skills CLI
3,764todayMIT
scenario-maya-lookdev
Use when shading an asset in Maya with Arnold: OpenPBR or aiStandardSurface materials, hooking up Substance Painter or UDIM texture sets, color spaces
SkillInstall · skills CLI
3,764todayMIT
scenario-maya-modeling
Use when modeling in Autodesk Maya, such as hard-surface props, weapons, vehicles, a sci-fi crate, a game-ready or SubD film model, or a character or
SkillInstall · skills CLI
3,764todayMIT
scenario-maya-pipeline-scripting
Use when writing or fixing Maya pipeline code in Python: mayapy batch jobs over many scenes, validating and auto-fixing scenes, FBX export for Unreal
SkillInstall · skills CLI
3,764todayMIT
scenario-maya-retopology-uv
Use when turning a dense sculpt, scan, ZBrush export or AI-generated mesh into animation-ready or game-ready topology in Maya without a mouse ("clean
SkillInstall · skills CLI
3,764todayMIT
scenario-maya-rigging
Use when rigging a character, creature or prop in Maya: "rig this character", placing or orienting joints, Orient Joint doing nothing, IK/FK switch an
SkillInstall · skills CLI
3,764todayMIT
scenario-unity-pipeline-automation
Use when automating a Unity 6.3 content pipeline or build: importing an art drop (FBX, PNG) with AssetPostprocessor rules and naming conventions, gene
SkillInstall · skills CLI
3,764todayMIT
scenario-unity-shaders
Use when a Unity 6.3 URP task involves shaders: hand-written HLSL, Shader Graph water, toon, dissolve or outline, Custom Function nodes, a renderer fe
SkillInstall · skills CLI
3,764todayMIT
scenario-unity-ui
Use when building or fixing game UI in Unity 6.3: main menu, settings screen (resolution, quality, volume, key rebinding), HUD, health bar, minimap fr
SkillInstall · skills CLI
3,764todayMIT
scenario-unity-world-building
Use when building a Unity 6.3 level or open world: terrain from code or heightmaps, procedural islands, erosion, splat and foliage rules, trees and gr
SkillInstall · skills CLI
3,764todayMIT
scenario-unreal-gameplay
Use when building or debugging UE5 gameplay: a character with double jump or dash, abilities with cooldowns, enemy AI that patrols, chases and attacks
SkillInstall · skills CLI
3,764todayMIT
scenario-unreal-world-building
Use when building or fixing an Unreal Engine 5 level or open world: World Partition, OFPA, Data Layers, Level Instances, Packed Level Actors, HLOD, la
SkillInstall · skills CLI
3,764todayMIT
scenario-zbrush-automation
Use when automating ZBrush 2026: batch processing a folder of OBJ or ZTL files, a ZBrush Python script or ZScript, recording a macro to learn a palett
SkillInstall · skills CLI
3,764todayMIT
scenario-zbrush-character-creature
Use when sculpting a realistic head, face, portrait, body or creature in ZBrush (anatomy, landmarks, proportions, "the face looks off", eyes, lips, ja
SkillInstall · skills CLI
3,764todayMIT
scenario-zbrush-expert
Use when an agent drives Maxon ZBrush 2026 for any task (sculpt in ZBrush, DynaMesh, ZRemesher, UVs, export, polypaint, posing, 3D print, clean up an
SkillInstall · skills CLI
3,764todayMIT
scenario-zbrush-hard-surface
Use when modeling hard surface in ZBrush 2026 (sci-fi helmet, weapon, prop, armor plates, mechanical parts, kitbash, vents, panel lines, bolts, concep
SkillInstall · skills CLI
3,764todayMIT
scenario-zbrush-paint-render
Use when polypainting in ZBrush (skin color zones, fills, cavity or AO passes, Spotlight), baking polypaint to a texture or vertex color, rendering a
SkillInstall · skills CLI
3,764todayMIT
scenario-zbrush-pose-print
Use when posing a sculpt or preparing it for 3D printing in ZBrush: "pose this character", Transpose Master, TPoseMesh, Gizmo posing with masks, ZSphe
SkillInstall · skills CLI
3,764todayMIT
scenario-zbrush-retopology-export
Use when a ZBrush sculpt, scan or AI-generated mesh must become production topology and files (ZRemesher and guides, the 2026 Retopo brush, reprojecti
SkillInstall · skills CLI
3,764todayMIT
scenario-zbrush-sculpting
Use when an agent sculpts organic forms in ZBrush 2026 (sculpt a head, bust or creature in ZBrush from a sphere, ZSpheres or primitives); when blockin
SkillInstall · skills CLI
3,764todayMIT
scenario-zbrush-stylized
Use when sculpting a stylized or cartoon character, bust, collectible or toy in ZBrush (Overwatch, Fortnite, Disney look), judging shape language (S a
SkillInstall · skills CLI
3,764todayMIT
anti-ui-slop
Stop coding agents from shipping generic UI. Use UIZZE's 800,000+ real web and iOS screens to build product-specific interfaces, define a design contr
SkillInstall · skills CLI
3,743todayMIT
figma-automation
Automate Figma tasks via Rube MCP (Composio): files, components, design tokens, comments, exports. Always search tools first for current schemas.
SkillInstall · skills CLI
3,743todayMIT
ios-hig-design-guide
Build, update, and apply iOS design specifications using Apple Human Interface Guidelines (HIG) source data. Use when a task asks for iOS UI/UX rules,
SkillInstall · skills CLI
3,743todayMIT
macos-design
Design and build native-feeling macOS application UIs. Use this skill whenever the user asks to create a desktop app, macOS app, Mac-style interface,
SkillInstall · skills CLI
3,743todayMIT
oiloil-ui-ux-guide
Modern, clean UI/UX guidance + review skill. Use when you need actionable UX/UI recommendations, design principles, or a design review checklist for n
SkillInstall · skills CLI
3,743todayMIT
oil-ui
设计、改进和评审网站、App、后台与组件的界面:探索设计方向、生成多风格同屏对比页,并基于真实截图打磨视觉层级;按请求交付对比页、设计说明、设计稿或可运行界面。只负责设计判断,不用于纯业务逻辑、接口构建、无界面变化的代码整理,或改法已完全明确的日常修改(如改文案、调数量、删指定元素、复用现有样式,哪
SkillInstall · skills CLI
3,2743 days agoMIT
add-component
Add a SwiftUI component from ShipSwift. Use when the user says "add component", "add a view", "add X view", "I need a chart", "add animation", or want
SkillInstall · skills CLI
3,2722 days agoMIT
build-feature
Build an iOS feature using ShipSwift components. Use when the user says "build", "create", "add a feature", or describes an iOS feature they want to i
SkillInstall · skills CLI
3,2722 days agoMIT
explore-skills
Explore and browse available ShipSwift components. Use when the user says "explore", "browse", "show skills", "list components", "what's available", o
SkillInstall · skills CLI
3,2722 days agoMIT
frontend-design-review
Review and create distinctive, production-grade frontend interfaces with high design quality and design system compliance. Evaluates using three pilla
SkillInstall · skills CLI
3,203todayMIT
frontend-ui-dark-ts
Build dark-themed React applications using Tailwind CSS with custom theming, glassmorphism effects, and Framer Motion animations. Use when creating da
SkillInstall · skills CLI
3,203todayMIT
react-flow-node-ts
Create React Flow node components with TypeScript types, handles, and Zustand integration. Use when building custom nodes for React Flow canvas, creat
SkillInstall · skills CLI
3,203todayMIT
zustand-store-ts
Create Zustand stores with TypeScript, subscribeWithSelector middleware, and proper state/action separation. Use when building React state management,
SkillInstall · skills CLI
3,203todayMIT
Argent
Drive iOS Simulators, Android emulators, TVs and Electron/web apps from your coding agent
MCP serverGitHub-verified authorLocal · npm
3,190todayApache-2.0
frontend-design
创建具有高设计品质、可交付生产的前端界面。当用户要求构建 Web 组件、页面、海报或应用(如官网、落地页、仪表盘、React/Vue 组件、HTML/CSS 布局,或对任意 Web UI 进行样式/美化)时使用本技能。产出有创意、打磨到位且避免「AI 通用审美」的代码与界面设计。
SkillInstall · skills CLI
3,1742 months agoApache-2.0
design-code
Generate production-ready, accessible, token-driven component code for ANY framework (React+Tailwind, Next.js, SwiftUI, Vue, Svelte, Angular, Solid, W
SkillInstall · skills CLI
3,1713 days agoMIT
design-component
Design a UI component spec to the house quality bar (anatomy, variants, sizes, the 8 states, token mapping, and accessibility). Use when the user want
SkillInstall · skills CLI
3,1713 days agoMIT
design-doctrine
The house rules for ANY design or UI work - the verification protocol (run the gate, never claim a number), the absolute no-emoji rule, token by inten
SkillInstall · skills CLI
3,1713 days agoMIT
design-qa
Set up or run design QA gates for token + hardcoded-value lint, automated a11y (axe), contrast, visual regression across variants/states/themes/RTL, a
SkillInstall · skills CLI
3,1713 days agoMIT
design-review
Review or audit a design/UI across 6 weighted dimensions with Nielsen's 10 heuristics and a prioritized findings table. Use when the user wants a desi
SkillInstall · skills CLI
3,1713 days agoMIT
design-screen
Design or build a page, screen, landing page, website, app or UI from a request - the whole job, end to end. Use this for "design a landing page", "bu
SkillInstall · skills CLI
3,1713 days agoMIT
design-tokens
Generate, extend, or audit design tokens in DTCG format with the 3-tier architecture (primitive → semantic → component). Use when the user wants a col
SkillInstall · skills CLI
3,1713 days agoMIT
figma-integration
Keep Figma and code in sync. Map the 3-tier DTCG tokens to Figma Variables (collections + modes), sync in either direction, use the Figma MCP when con
SkillInstall · skills CLI
3,1713 days agoMIT
image-to-code
Turn a reference image, screenshot, or mockup into token-driven, accessible code. Infer the design system from the reference (palette, type scale, spa
SkillInstall · skills CLI
3,1713 days agoMIT
migrate-design-system
Map this token system to or from any external design system (Material Design 3, Apple HIG, Fluent, Carbon, Ant, shadcn/ui, Radix, Chakra, Mantine, Boo
SkillInstall · skills CLI
3,1713 days agoMIT
performance
Optimize UI performance against Core Web Vitals (LCP, INP, CLS) with loading/code-split strategy, layout-shift prevention, and animation performance r
SkillInstall · skills CLI
3,1713 days agoMIT
prototype
Move an idea up the fidelity ladder (content-first → wireframe → low-fi → high-fi → code) with a validation plan at each level, plus user-journey mapp
SkillInstall · skills CLI
3,1713 days agoMIT
redesign
Upgrade an existing website or app to premium quality without breaking functionality. Audit the current design, identify generic/AI tells, then apply
SkillInstall · skills CLI
3,1713 days agoMIT
scaffold-project
Scaffold a new design-product project that matches the recommended Claude Code layout (the reference structure). Use when starting a fresh product/app
SkillInstall · skills CLI
3,1713 days agoMIT
token-build
Set up or run the token build pipeline. Transform the DTCG tokens/*.json (source of truth) into platform artifacts (CSS variables, Tailwind @theme, JS
SkillInstall · skills CLI
3,1713 days agoMIT
ux-writing
Write or review UI copy (buttons, errors, empty states, microcopy, notifications, labels) using the voice & tone system (clear, concise, useful, human
SkillInstall · skills CLI
3,1713 days agoMIT
skillshare-ui-website-style
Skillshare frontend design system for the React dashboard (ui/) and Docusaurus website (website/). Use this skill whenever you: build or modify a dash
SkillInstall · skills CLI
3,112todayMIT
design-engineering
Apply interface craft when building or reviewing UI - motion, easing, timing, springs, component feel, and visual foundations. Use when building a com
SkillInstall · skills CLI
2,95545 days ago—
draft
UX designer — user flows, information architecture, wireframes, and interaction design.
SkillInstall · skills CLI
2,919todayMIT
draft-flow
Use when asked to design a user flow, map how a user moves through a feature, create a wireframe or flow diagram, or document interaction design for a
SkillInstall · skills CLI
2,919todayMIT
draft-ia
Information architecture — design navigation structure, content hierarchy, sitemap, and taxonomy for a product or feature set. Use when asked to "orga
SkillInstall · skills CLI
2,919todayMIT
draft-landing
Use when asked to structure a landing page, design page layout for conversion, or plan landing page information architecture. Examples: "landing page
SkillInstall · skills CLI
2,919todayMIT
draft-patterns
Use when asked about UX patterns, interaction best practices, form design, navigation patterns, or loading states. Examples: "best practice for form v
SkillInstall · skills CLI
2,919todayMIT
draft-recon
UI and UX reconnaissance — scan existing frontend routes, components, navigation, and flows to understand the current UX state before designing. Use w
SkillInstall · skills CLI
2,919todayMIT
draft-review
Usability review — evaluate an existing flow or UI against usability heuristics, flag friction points, and recommend fixes. Use when asked to "review
SkillInstall · skills CLI
2,919todayMIT
draft-wireframe
Wireframe a screen — text/ASCII by default, or hand-drawn HTML when the user says "sketch", "hand-drawn", "lo-fi HTML", "whiteboard", "graph paper", o
SkillInstall · skills CLI
2,919todayMIT
proof-design
Design QA audit — red flags, severity classification, visual quality scorecard. Use when asked to "QA the design", "check visual quality", "design rev
SkillInstall · skills CLI
2,919todayMIT
django-patterns
Django architecture patterns including DRF, ORM optimization, signals, middleware, and project structure
SkillInstall · skills CLI
2,8386 months agoApache-2.0
frontend-excellence
Modern frontend patterns for React Server Components, performance optimization, and Core Web Vitals
SkillInstall · skills CLI
2,8386 months agoApache-2.0
nextjs-mastery
Next.js 14+ App Router patterns including RSC, ISR, middleware, parallel routes, and data fetching
SkillInstall · skills CLI
2,8386 months agoApache-2.0
react-patterns
React 19 patterns including Server Components, Actions, Suspense, hooks, and component composition
SkillInstall · skills CLI
2,8386 months agoApache-2.0
Semiotic
Verified React chart generation: select, validate, repair, render, and inspect charts through MCP.
MCP serverGitHub-verified authorLocal · npm
2,7171 day agoApache-2.0
improve-app
Guided journey from a shipped app that works but feels rough to a product that fits the job, flows without friction, reads clearly, and persuades hone
SkillInstall · skills CLI
2,692todayMIT
inspired-product
Build empowered product teams using discovery and delivery dual-track. Use when the user mentions "product discovery", "empowered teams", "feature fac
SkillInstall · skills CLI
2,692todayMIT
ios-hig-design
Design native iOS interfaces following Apple Human Interface Guidelines. Use when the user mentions "iPhone app", "iPad layout", "SwiftUI", "UIKit", "
SkillInstall · skills CLI
2,692todayMIT
lean-ux
Apply lean thinking to UX: hypothesis-driven design, collaborative sketching, and rapid experiments instead of heavy deliverables. Use when the user m
SkillInstall · skills CLI
2,692todayMIT
refactoring-ui
Audit and fix visual hierarchy, spacing, color, and depth in web UIs. Use when the user mentions "my UI looks off" (or amateur/unprofessional), "fix t
SkillInstall · skills CLI
2,692todayMIT
steve-jobs-design-review
Review designs, products, and features with Steve Jobs'' standards: ruthless simplicity, focus, and end-to-end excellence. Use when the user mentions
SkillInstall · skills CLI
2,692todayMIT
top-design
Create award-winning, immersive web experiences at the level of Awwwards-featured agencies. Use when the user mentions "Awwwards quality", "make my si
SkillInstall · skills CLI
2,692todayMIT
ux-heuristics
Evaluate and improve interface usability using heuristic analysis. Use when the user mentions "usability audit", "users are confused", "form usability
SkillInstall · skills CLI
2,692todayMIT
web-typography
Select, pair, and implement typefaces for web projects. Use when the user mentions "font pairing", "which typeface", "line height", "responsive typogr
SkillInstall · skills CLI
2,692todayMIT
design-system-starter
Create and evolve design systems with design tokens, component architecture, accessibility guidelines, and documentation templates. Ensures consistent
SkillInstall · skills CLI
2,6798 months agoMIT
frontend-to-backend-requirements
Document frontend data needs for backend developers. Use when frontend needs to communicate API requirements to backend, or user says 'backend require
SkillInstall · skills CLI
2,6798 months agoMIT
mui
Material-UI v7 component library patterns including sx prop styling, theme integration, responsive design, and MUI-specific hooks. Use when working wi
SkillInstall · skills CLI
2,6798 months agoMIT
react-dev
This skill should be used when building React components with TypeScript, typing hooks, handling events, or when React TypeScript, React 19, Server Co
SkillInstall · skills CLI
2,6798 months agoMIT
react-useeffect
React useEffect best practices from official docs. Use when writing/reviewing useEffect, useState for derived values, data fetching, or state synchron
SkillInstall · skills CLI
2,6798 months agoMIT
vscode
VS Code integration for viewing diffs and comparing files. Use when showing file differences to the user.
SkillInstall · skills CLI
2,6595 months agoMIT
gentle-ai-tui-design
Trigger: terminal UI design, TUI redesign, Gentle Shell look, IDE in a terminal, sidebar/status bar polish, critique TUI. Refine terminal UIs with vis
SkillInstall · skills CLI
2,585todayMIT
gentle-design
Trigger: design a screen or page, mockup, landing page, UI directions, artboards, try a different approach, design system sync. HTML design directions
SkillInstall · skills CLI
2,585todayMIT
gentle-ui-design
Trigger: product interface design, web UI, design critique, browsing experience, responsive layout. Guide usable interfaces for the current project.
SkillInstall · skills CLI
2,585todayMIT
stack-diagram
Create cloud-architecture-style diagrams of tech stacks, system architectures, infra layouts, and service topologies — with real brand logos, grouped
SkillInstall · skills CLI
2,486todayMIT
eli5
WHAT: Explains a codebase, a folder, a feature, a command or a pull request to someone who knows nothing about it, as a PR Lens canvas whose walkthrou
SkillInstall · skills CLI
2,401todayMIT
pr-lens
WHAT: Draws a code change or part of a codebase as an animated architecture, data-flow or data-model diagram, on its own or in a pull request. WHEN: a
SkillInstall · skills CLI
2,401todayMIT
compose-screens-footguns
Compose screen and interaction traps: navigation, adaptive layout, window insets, pagers, toolbars, sheets, list drag and selection, sliders, text fie
SkillInstall · skills CLI
2,30616 days agoGPL-3.0
compose-visuals-footguns
Compose look-and-feel traps: theme and colour tokens, artwork palettes, gradients and scrims, shimmer, glass and particle effects, animation, image lo
SkillInstall · skills CLI
2,30616 days agoGPL-3.0
desktop-and-build-footguns
Desktop JVM and build traps: JNA natives, bundling, memory, packaging, code signing, R8, deep links, Gradle and CI releases. Use when a desktop build
SkillInstall · skills CLI
2,30616 days agoGPL-3.0
aesthetic
Create aesthetically beautiful interfaces following proven design principles. Use when building UI/UX, analyzing designs from inspiration sites, gener
SkillInstall · skills CLI
2,2447 months ago—
frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, o
SkillInstall · skills CLI
2,2447 months ago—
frontend-dev-guidelines
Frontend development guidelines for React/TypeScript applications. Modern patterns including Suspense, lazy loading, useSuspenseQuery, file organizati
SkillInstall · skills CLI
2,2447 months ago—
ui-styling
Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-
SkillInstall · skills CLI
2,2447 months ago—
web-frameworks
Build modern full-stack web applications with Next.js (App Router, Server Components, RSC, PPR, SSR, SSG, ISR), Turborepo (monorepo management, task p
SkillInstall · skills CLI
2,2447 months ago—
TypeUI
Design systems, UI prompts, and layout variations for AI coding tools.
MCP serverGitHub-verified authorRemoteSign-in needed
2,24222 days ago—
typeui
Use TypeUI with Grok to access project design skills, brand kits, UI prompts, and layout variations through the TypeUI MCP server when creating or ref
SkillInstall · skills CLI
2,24222 days ago—
typeui
Use TypeUI with Hermes Agent to access project design skills, brand kits, UI prompts, and layout variations through the TypeUI MCP server when creatin
SkillInstall · skills CLI
2,24222 days ago—
typeui
Use TypeUI with OpenClaw to access project design skills, brand kits, UI prompts, and layout variations through the TypeUI MCP server when creating or
SkillInstall · skills CLI
2,24222 days ago—
typeui-fundamentals
Universal UI/UX design principles covering visual hierarchy, interaction laws, typography foundations, and WCAG accessibility requirements. Use when m
SkillInstall · skills CLI
2,24222 days ago—
accessibility
Build WCAG 2.1 AA compliant websites with semantic HTML, proper ARIA, focus management, and screen reader support. Includes color contrast (4.5:1 text
SkillInstall · skills CLI
2,1921 day agoMIT
activity-campaign-from-ui
Turn campaign UI references into a new H5/Web campaign proposal, page architecture, and HTML/CSS/JavaScript high-fidelity front-end draft. Supports mo
SkillInstall · skills CLI
2,1921 day agoMIT
afrexai-react-production
Complete methodology for building production-grade React applications with architecture decisions, component design, state management, performance opt
SkillInstall · skills CLI
2,1921 day agoMIT
anima
Turns ideas into live, full-stack web applications with editable code, built-in database, user authentication, and hosting. Anima is the design agent
SkillInstall · skills CLI
2,1921 day agoMIT
figma
Figma design platform integration. Access design files, extract component information, read design tokens, and translate designs into code. Bridge the
PluginAnthropic marketplace
2,1821 day ago—
Figma MCP Server
The Figma MCP server brings Figma design context directly into your AI workflow.
MCP serverVerified domain · mcp.figma.comRemoteSign-in needed
2,1821 day ago—
application-performance-performance-optimization
Optimize end-to-end application performance with profiling, observability, and backend/frontend tuning. Use when coordinating performance optimization
SkillInstall · skills CLI
2,0096 days agoMIT
architect-review
Master software architect specializing in modern architecture patterns, clean architecture, microservices, event-driven systems, and DDD. Reviews syst
SkillInstall · skills CLI
2,0096 days agoMIT
article-illustrations
Generate hand-drawn 16:9 article illustrations featuring the Grav character IP. Turns article concepts into memorable whiteboard-sketch explanations w
SkillInstall · skills CLI
2,0096 days agoMIT
backend-architect
Expert backend architect specializing in scalable API design, microservices architecture, and distributed systems. Masters REST/GraphQL/gRPC APIs, eve
SkillInstall · skills CLI
2,0096 days agoMIT
backend-development-feature-development
Orchestrate end-to-end backend feature development from requirements to deployment. Use when coordinating multi-phase feature delivery across teams an
SkillInstall · skills CLI
2,0096 days agoMIT
backend-security-coder
Expert in secure backend coding practices specializing in input validation, authentication, and API security. Use for backend security implementations
SkillInstall · skills CLI
2,0096 days agoMIT
bash-pro
Master of defensive Bash scripting for production automation, CI/CD pipelines, and system utilities. Expert in safe, portable, and testable shell scri
SkillInstall · skills CLI
2,0096 days agoMIT
blockchain-developer
Build production-ready Web3 applications, smart contracts, and decentralized systems. Implements DeFi protocols, NFT platforms, DAOs, and enterprise b
SkillInstall · skills CLI
2,0096 days agoMIT
business-analyst
Master modern business analysis with AI-powered analytics, real-time dashboards, and data-driven insights. Build comprehensive KPI frameworks, predict
SkillInstall · skills CLI
2,0096 days agoMIT
c-pro
Write efficient C code with proper memory management, pointer arithmetic, and system calls. Handles embedded systems, kernel modules, and performance-
SkillInstall · skills CLI
2,0096 days agoMIT
c4-architecture-c4-architecture
Generate comprehensive C4 architecture documentation for an existing repository/codebase using a bottom-up analysis approach.
SkillInstall · skills CLI
2,0096 days agoMIT
c4-code
Expert C4 Code-level documentation specialist. Analyzes code directories to create comprehensive C4 code-level documentation including function signat
SkillInstall · skills CLI
2,0096 days agoMIT
c4-component
Expert C4 Component-level documentation specialist. Synthesizes C4 Code-level documentation into Component-level architecture, defining component boun
SkillInstall · skills CLI
2,0096 days agoMIT
c4-container
Expert C4 Container-level documentation specialist. Synthesizes Component-level documentation into Container-level architecture, mapping components to
SkillInstall · skills CLI
2,0096 days agoMIT
c4-context
Expert C4 Context-level documentation specialist. Creates high-level system context diagrams, documents personas, user journeys, system features, and
SkillInstall · skills CLI
2,0096 days agoMIT
frontend-developer
Build React components, implement responsive layouts, and handle client-side state management. Masters React 19, Next.js 15, and modern frontend archi
SkillInstall · skills CLI
2,0096 days agoMIT
frontend-mobile-development-component-scaffold
Scaffold React and React Native components with TypeScript, accessibility, styles, and tests. Use when building reusable UI components or establishing
SkillInstall · skills CLI
2,0096 days agoMIT
graphql-architect
Master modern GraphQL with federation, performance optimization, and enterprise security. Build scalable schemas, implement advanced caching, and desi
SkillInstall · skills CLI
2,0096 days agoMIT
tailwind-design-system
Build scalable design systems with Tailwind CSS, design tokens, component libraries, and responsive patterns. Use when creating component libraries, i
SkillInstall · skills CLI
2,0096 days agoMIT
ui-ux-designer
Create interface designs, wireframes, and design systems. Masters user research, accessibility standards, and modern design tools. Specializes in desi
SkillInstall · skills CLI
2,0096 days agoMIT
senior-frontend
Frontend development skill for React, Next.js, TypeScript, and Tailwind CSS applications. Use when building React components, optimizing Next.js perfo
SkillInstall · skills CLI
1,9949 days ago—
build-macos-apps
Build professional native macOS apps in Swift with SwiftUI and AppKit. Full lifecycle - build, debug, test, optimize, ship. CLI-only, no Xcode.
SkillInstall · skills CLI
1,9897 months agoMIT
beautify-github-readme
Redesign GitHub README homepages or create project-native pure SVG, hybrid SVG-composed PNG/WebP, and opt-in animated GIF assets. Use when a user asks
SkillInstall · skills CLI
1,9641 day agoMIT
dsh-client-ui-ux
设计、实现或审查客户端 UI、响应式布局、交互状态、焦点或失败反馈时使用,结合真实运行界面验证用户体验。
SkillInstall · skills CLI
1,872todayMIT
build-and-verify
Build a SwiftUI macOS app from the command line, install it, and check light and dark window snapshots of every page before calling a change done. Use
SkillInstall · skills CLI
1,8118 days agoMIT
ux-design
UX pass for one feature of a macOS app, covering names, flow, where it opens (inline, popover, sheet, window, alert), states, words, hover help, acces
SkillInstall · skills CLI
1,8118 days agoMIT
react-navigation
Provides React Navigation UI patterns for stacks, tabs, drawers etc. Use when building navigation UIs with React Navigation, configuring headers, bott
SkillInstall · skills CLI
1,70836 days agoMIT

Filters apply to the top 400 of 1,454 tools by stars. Full list for agents: dev-frontend.json