UI Skills (Powerball Harness)

Trust Score 88/100

Generates accessible UI components, landing sections, hero areas and feedback forms with constraint-driven rules and an accessibility quality gate.

triggers:generate uicreate hero sectionlanding pagecontact formaccessible formfrontend componentui component

GitHub SKILL.md

What it does

A collection of UI-focused skills that generate front-end visual elements such as components, landing page sections, hero sections, and contact/feedback forms. The skill enforces constraint priority rules and an accessibility quality gate, then produces component markup and guidance based on referenced design constraints.

When to use it

Use when the user requests UI elements, landing pages, hero sections, accessible forms, or front-end visual components. Use the skill when accessibility, semantic markup, and a consistent constraint set are required, or when the user explicitly requests edgy/expressive frontend styles (the skill applies different reference sets in that case).

What's included

Scripts: none detected in the harness skill directory.
References: includes references/ (frontend constraint docs) used as the authoritative style/constraint source.
Instructions: priority rules for constraint application, an accessibility checklist (a11y), and step-by-step generation guidance for components and feedback forms.

Compatible agents

Designed for agents that can read references and emit code/markup (Claude Code, Copilot-like agents, code-capable assistants).

Audit Summary

UI skill from the powerball-harness Claude Code plugin ecosystem. Provides constraint-driven UI component generation with a detailed MUST/SHOULD/NEVER rule set for Tailwind/React/shadcn stacks, accessibility quality gates, and organized reference files. No scripts to execute — purely instruction-based. The SKILL.md is well-structured but the source_path in the DB (harness/skills/ui/) doesn't match the actual location (.claude/skills/ui/), suggesting the DB entry may be stale or the repo was reorganized.

Watch Out

Skill lives at .claude/skills/ui/ not harness/skills/ui/ — DB source_path may be incorrect
Tied to specific tech stack (Tailwind, motion/react, shadcn/ui, cn utility)
user-invocable: false — designed as sub-skill within harness, not standalone

Notes

No security concerns — pure instruction skill with no scripts, no network calls, no credentials. External URLs in references are citations only. The detailed constraint system (MUST/SHOULD/NEVER) for UI implementation quality is well-designed. Accessibility quality gate is a strong positive.

Information

Repository: powerball-harness
Stars: 25
Installs: 0

Trust Score

Overall88

Security98

Code Quality78

Architecture76

Usefulness58

Related Skills

Clerk Vue Patterns

Vue 3 integration patterns for Clerk: composables, router guards, and Pinia auth store integration.

Colorize (Strategic UI Color)

Introduce purposeful color into monochromatic or dull interfaces to improve hierarchy, meaning, and emotional warmth while preserving accessibility.

Cognitive Accessibility Specialist

Audits content, forms and authentication flows for cognitive accessibility (WCAG 2.2 / COGA) and gives prioritized remediation and plain-language guidance.

React Development Expert

Provides authoritative React guidance on hooks, state patterns, Server Components, performance optimization, and common architectural patterns.

ClearShot — Screenshot UI Analysis

Structured UI screenshot analysis using a 5×5 spatial grid, full element inventory, and design system extraction. Escalates to full implementation blueprint whe

Colorize — Strategic UI Color Introduction

Introduce purposeful color to monochromatic interfaces to improve hierarchy, meaning, and visual engagement while preserving accessibility.

DAUB UI

A drop-in CSS+JS component library with 70+ carefully designed components and 20 theme families for fast, consistent UI building.

Request My EHI Export

Guides patients through requesting their complete Electronic Health Information (EHI) export: identifies vendor, finds forms, fills requests, and builds a ready

Back to Skills