What problem does it solve? Designing high-fidelity HTML artifacts in CLI/API agent environments often produces generic, low-quality output because hosted design tools and their workflows are unavailable. This Skill ports the Claude Design process—brief scoping, context gathering, variant exploration, and verification—into a local workflow that produces polished, self-contained HTML files. ## 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), building the artifact, and verifying it locally. - Multiple Artifact Formats: Produces landing pages, interactive prototypes, 1920x1080 HTML slide decks with keyboard navigation, component labs, and motion studies as single self-contained HTML files. - Variant Exploration & Tweaks Panels: Generates conservative, strong-fit, and divergent design options, plus optional in-page Tweaks controls for theme, density, and accent color persisted via localStorage. - Use Case: Ask for a landing page for a new product; the agent inspects your repo's existing tokens and components, produces three design directions in one HTML file, verifies it opens cleanly, and reports the exact file path. ## Quick Start Ask the agent to design a landing page or interactive prototype as a self-contained HTML file, providing any brand docs, screenshots, or repo context available.
