Back to categories
Category

Agent Skills in category: ui

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

ui

Generates UI components and feedback forms. Use when user mentions コンポーネント, component, UI, ヒーロー, hero, フォーム, form, フィードバック, feedback, 問い合わせ. Do NOT load for: 認証機能, バックエンド実装, データベース操作, ビジネスロジック.

[uicomponentformfeedback]
aiskillstore
aiskillstore
23014

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
prof-ramos
prof-ramos
0

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
Wattysaid
Wattysaid
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, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.

frontendhtml-cssreactresponsive-design
Wattysaid
Wattysaid
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, or applications. Generates creative, polished code that avoids generic AI aesthetics.

frontendweb-componentshtml-cssresponsive-design
atgfw
atgfw
0

shadcn-ui

shadcn/ui best practices for Next.js applications including component composition, Radix UI patterns, Tailwind integration, Server/Client boundaries, and preventing component duplication. Use when working with shadcn/ui components, reviewing frontend code, or when questions involve shadcn, Radix UI, component libraries, or React patterns.

shadcn-uinextjsradix-uitailwind-css
MylesMCook
MylesMCook
0

rails-inertia

Specialized skill for building modern SPAs with Inertia.js, React/Vue/Svelte, and Rails. Use when creating Inertia pages, handling forms, implementing client-side routing, managing shared data, or building interactive frontends. Alternative to traditional Rails views or full API approach.

inertia.jsrailssparouting
alec-c4
alec-c4
385

rails-viewcomponents

Specialized skill for building ViewComponents with Hotwire (Turbo & Stimulus). Use when creating reusable UI components, implementing frontend interactions, building Turbo Frames/Streams, or writing Stimulus controllers. Includes component testing with Lookbook.

viewcomponentshotwirestimulusui-components
alec-c4
alec-c4
385

reflex

Build and debug Reflex (rx) UIs in this repo. Use for editing ui/*.py, choosing rx components, fixing Var/conditional/foreach issues, and applying responsive/layout patterns from the Reflex docs.

pythonui-componentscomponent-compositionreflex
QuixiAI
QuixiAI
52869

netresearch-branding

Agent Skill: Apply Netresearch brand identity. MANDATORY for Netresearch projects. Include: (1) [n] logo, (2) colors #2F99A4/#FF4D00/#585961, (3) Raleway+Open Sans fonts.

brandingbrand-identitylogocolor-palette
netresearch
netresearch
20