frontend-designlisted
Install: claude install-skill JasonxzWen/harness-hub
This skill guides creation of intentional, production-grade frontend interfaces. Implement real working code with attention to product context, visual coherence, and interaction details.
> Harness Hub adaptation: common visual patterns are contextual design evidence, not a blacklist, and intensity follows the product rather than a house style.
The user provides frontend requirements: a component, page, application, or interface to build. They may include context about the purpose, audience, or technical constraints.
## Design Thinking
Before coding, understand the context and commit to a deliberate, context-appropriate aesthetic direction:
- **Purpose**: What problem does this interface solve? Who uses it?
- **Foundation**: Preserve the existing design system, brand assets, platform conventions, and product vocabulary when they are authoritative.
- **Tone**: Choose a coherent visual language whose intensity fits the audience, task frequency, and consequences.
- **Constraints**: Technical requirements (framework, performance, accessibility).
- **Differentiation**: What should be especially clear, useful, or recognizably specific to this product?
Choose a clear conceptual direction and execute it with precision. The standard is intentionality, not novelty or intensity.
## On-Demand External Evidence
When a user describes a UI element by appearance or behavior and its exact name affects component choice, consult NameThatUI's static Agent index at `https://namethatui.com/l