ui

Generate accessible UI components like hero sections and contact forms.

39|46|Updated May 29, 2026
One-click install
npx skills add https://github.com/maxwell2732/claudecode-research-harness-workflow --skill ui-maxwell2732
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui
Source: https://github.com/maxwell2732/claudecode-research-harness-workflow/tree/main/skills/ui
Command: npx skills add https://github.com/maxwell2732/claudecode-research-harness-workflow --skill ui-maxwell2732

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

UI design teams often struggle to rapidly produce consistent, accessible UI components across projects and platforms.

Core Features & Use Cases

  • Automatic generation of UI components (hero sections, forms, feedback surfaces, and contact forms) with accessible semantics.
  • Reuse of reference design tokens and patterns to ensure consistency and speed.
  • Quick-start templates to bootstrap frontend work with ready-to-use primitives and patterns.

Quick Start

Use the UI Skill to generate a responsive hero and a contact form with accessible controls.

Frequently Asked Questions about ui

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate accessible UI components and forms for frontend design?

Generate accessible UI components by applying constraints and reusing references to ensure compliance with accessibility standards. It automatically produces hero sections, forms, and feedback widgets with accessible semantics and design coherence.

How do I build a responsive hero and contact form with accessible controls?

Build a responsive hero and contact form using quick-start templates that bootstrap frontend work with ready-to-use primitives. These templates enforce accessible semantics and reuse design tokens to maintain consistency and speed.

Can I use Tailwind to maintain design consistency across UI components?

Yes, Tailwind supports maintaining design consistency across UI components. The skill reuses reference design tokens and patterns to automatically generate consistent hero sections, forms, and feedback widgets.

What is the best way to ensure accessibility compliance when generating frontend design elements?

The best way to ensure accessibility compliance is enforcing constraints and reusing references during UI generation. This approach guarantees accessible semantics for components like forms and contact surfaces while integrating with existing guidelines.

Do I need existing UI guidelines to generate consistent feedback widgets?

No, you do not need existing UI guidelines to generate consistent feedback widgets. The skill reuses internal reference patterns and design tokens to enforce compliance and maintain design coherence automatically.

Why does my generated UI form lack design coherence across different projects?

Generated UI forms lack design coherence when constraints and references are not enforced. The skill solves this by reusing design tokens and patterns, ensuring accessible semantics and consistency across all generated components.