What problem does it solve? Designing high-fidelity HTML artifacts in CLI/API environments often produces generic, low-quality output because agents lack a structured design process and taste guidelines. This Skill provides a complete design workflow—brief scoping, context gathering, system definition, variant exploration, and verification—so agents produce thoughtful, self-contained HTML artifacts instead of generic SaaS layouts. ## Core Features & Use Cases - Structured Design Workflow: Guides the agent through understanding the brief, gathering brand/repo context, defining a design system (colors, type, spacing, motion), and building the artifact. - Multiple Artifact Formats: Supports landing pages, interactive prototypes, 1920x1080 HTML slide decks with keyboard navigation, component labs, and motion studies, all as self-contained HTML files. - Variant Exploration & Tweaks Panels: Produces conservative, strong-fit, and divergent design options, plus optional in-page Tweaks controls for theme, density, and accent color persisted via localStorage. - Use Case: A user asks for a landing page prototype for a new product. The Skill inspects the repo's existing tokens and components, defines a small color and type system, generates three layout variants in one HTML file, verifies the file opens cleanly, and reports the exact path. ## Quick Start Ask the agent to design a self-contained HTML landing page or interactive prototype for your product, providing any brand docs, screenshots, or repo context available.
