Back to categories
Category

Agent Skills in category: ui

274 skills match this category. Browse curated collections and explore related Agent Skills.

custom-plugin-flutter-skill-animations

Production-grade Flutter animations mastery - Implicit and explicit animations, AnimationController, Hero transitions, physics-based motion, Lottie/Rive integration, 60fps optimization with comprehensive code examples

flutteranimationsperformance-optimizationlottie
pluginagentmarketplace
pluginagentmarketplace
1

custom-plugin-flutter-skill-accessibility

Production-grade Flutter accessibility mastery - Semantics API, screen readers (VoiceOver/TalkBack), WCAG 2.1 AA/AAA compliance, inclusive design patterns, automated a11y testing with comprehensive code examples

flutteraccessibilityscreen-readerWCAG
pluginagentmarketplace
pluginagentmarketplace
1

frontend-design

Expert frontend design guidelines for creating beautiful, modern UIs. Use when building landing pages, dashboards, or any user interface.

frontendui-designweb-designresponsive-design
elliottminns
elliottminns
1

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 complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.

reacttailwind-cssshadcn-uihtml-generation
QuestForTech-Investments
QuestForTech-Investments
2

frontend-design

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.

frontendfrontend-developmenthtml-cssresponsive-design
zircote
zircote
42

ui-styling

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 systems, creating responsive layouts, adding accessible components (dialogs, dropdowns, forms, tables), customizing themes and colors, implementing dark mode, generating visual designs and posters, or establishing consistent styling patterns across applications.

tailwind-cssshadcn-uiradix-uiresponsive-layout
zircote
zircote
42

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 complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.

reacttailwind-cssshadcn-uistate-management
zircote
zircote
42

animation-designer

Expert in web animations, transitions, and motion design using Framer Motion and CSS

animationframer-motioncssmotion-design
daffy0208
daffy0208
55

Accessibility Engineer

Implement accessibility (a11y) best practices to make applications usable by everyone. Use when building UIs, conducting accessibility audits, or ensuring WCAG compliance. Covers screen readers, keyboard navigation, ARIA attributes, and inclusive design patterns.

accessibilitya11yWCAGscreen-reader
daffy0208
daffy0208
55

form-react

Production-ready React form patterns using React Hook Form (default) and TanStack Form with Zod integration. Use when building forms in React applications. Implements reward-early-punish-late validation timing.

reactreact-hook-formtanstack-formzod
Bbeierle12
Bbeierle12
3

form-accessibility

WCAG 2.2 AA compliance for forms, ARIA patterns, focus management, keyboard navigation, and screen reader support. Use when implementing accessible forms in any framework. The compliance foundation that ensures forms work for everyone.

standards-compliancewcagariakeyboard-navigation
Bbeierle12
Bbeierle12
3

platform-building

Platform-specific building systems for mobile, VR, and accessibility. Use when implementing touch controls for building games, VR spatial input, colorblind-friendly feedback, or cross-platform building mechanics. Covers input adaptation and inclusive design patterns.

mobile-developmentvraccessibilityinput-adaptation
Bbeierle12
Bbeierle12
3

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 complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.

reacttailwind-cssshadcn-uihtml-generation
Bbeierle12
Bbeierle12
3

builder-ux

Builder user experience systems for Three.js building games. Use when implementing prefab/blueprint save/load, undo/redo command patterns, ghost preview placement, multi-select, or copy/paste building mechanics. Covers the UX layer that makes building feel responsive and intuitive.

threejsbuilder-uxprefabundo-redo
Bbeierle12
Bbeierle12
3

component-library

Comprehensive React component library with 30+ production-ready components using shadcn/ui architecture, CVA variants, Radix UI primitives, and Tailwind CSS. Use when users need to (1) Create React UI components with modern patterns, (2) Build complete component systems with consistent design, (3) Implement accessible, responsive, dark-mode-ready components, (4) Generate form components with React Hook Form integration, (5) Create data display components like tables, cards, charts, or (6) Build navigation, layout, or feedback components. Provides instant generation of customizable components that would otherwise take 20-45 minutes each to hand-code.

reactcomponent-librarytailwind-cssradix-ui
Bbeierle12
Bbeierle12
3

gsap-router

Router for GSAP animation domain. Use when implementing animations with GreenSock Animation Platform including tweens, timelines, scroll-based animations, or React integration. Routes to 4 specialized skills for fundamentals, sequencing, ScrollTrigger, and React patterns.

gsapanimationroutingscrolltrigger
Bbeierle12
Bbeierle12
3

g-sui

Server-rendered Go UI framework. Use when building g-sui applications, creating UI components, handling forms with server actions, using data tables, setting up routes, or implementing WebSocket patches. Triggered by "g-sui", "server-rendered UI", "Go UI framework", form handling, or data collation.

goserver-rendered-uiframeworkform-handling
michalCapo
michalCapo
2

forms-implementation

Build reactive and template-driven forms, implement custom validators, create async validators, add cross-field validation, and generate dynamic forms for Angular applications.

angular-formstypescriptui-componentsvalidation
pluginagentmarketplace
pluginagentmarketplace
2

Page 5 of 16 · 274 results