skills.rest
AlvaroBiano
AlvaroBianoCOMMUNITY
Explore all skills by this author →
GitHub

claude-design

Convert design briefs into self-contained HTML artifacts with embedded CSS and JavaScript.

Updated May 2, 2026
Search Tags:#design#html#cli#prototype#artifact#landing-page
One-click install
npx skills add https://github.com/AlvaroBiano/hermes-agent --skill claude-design-alvarobiano
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: claude-design
Source: https://github.com/AlvaroBiano/hermes-agent/tree/main/skills/creative/claude-design
Command: npx skills add https://github.com/AlvaroBiano/hermes-agent --skill claude-design-alvarobiano

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Design briefs in CLI/API contexts often lack hosted design tools, making it hard to preserve Claude Design's process and taste when delivering high-fidelity HTML artifacts.

Core Features & Use Cases

  • Process-driven design: translates briefs into local HTML artifacts that embody Claude Design's taste.
  • Artifact types: landing pages, prototypes, decks, motion studies, and design explorations.
  • Variants support: produce Conservative, Strong-fit, and Divergent options to explore taste boundaries.
  • Local-first delivery: outputs a single self-contained HTML file with embedded CSS/JS for portability.

Quick Start

Provide a complete self-contained HTML artifact saved as a local file that matches the given brief.

Frequently Asked Questions about claude-design

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

FAQPage Schema
How do I generate HTML landing pages from a design brief in a CLI environment?▼

To generate HTML landing pages from a design brief in a CLI environment, provide the brief to the tool to produce a single, self-contained HTML file with embedded CSS and JavaScript. This local-first delivery ensures portability without needing hosted design tools.

What are design variants and how do they work for HTML prototypes?▼

Design variants for HTML prototypes work by generating three distinct options: Conservative, Strong-fit, and Divergent. This allows you to explore different taste boundaries and design directions directly from a single brief in CLI contexts.

Can I create self-contained HTML artifacts without hosted design tools?▼

Yes, you can create self-contained HTML artifacts without hosted design tools by using a process-driven CLI approach. It outputs a single local file with embedded CSS and JavaScript, preserving design taste and process where hosted tools are unavailable.

Does this design tool validate HTML artifacts against a design-token system?▼

Yes, this design tool validates HTML artifact fidelity against a minimal design-token system when one is present. This ensures the generated landing pages, prototypes, and decks maintain strict visual consistency with established tokens.

What types of HTML artifacts can I build for design explorations using the CLI?▼

You can build landing pages, prototypes, decks, and motion studies for design explorations using the CLI. These artifact types are generated as local, self-contained HTML files to facilitate high-fidelity design reviews.

What are the limitations of generating HTML artifacts in a CLI context?▼

A limitation of generating HTML artifacts in a CLI context is the lack of real-time visual editing found in hosted design tools. Additionally, fidelity validation depends on a minimal design-token system being explicitly provided during generation.

Related Skills

Explore More Design & Creative Skills→
JuanMS20JuanMS20

claude-design

Translates design briefs into self-contained HTML artifacts for CLI/API environments.

Community
Advanced
8GG-Git8GG-Git

interactive-dashboard-builder

Generate self-contained HTML dashboards with Chart.js and dropdown filters.

Community
Intermediate
zircotezircote
3

web-artifacts-builder

Bundle React, TypeScript, and Tailwind frontend artifacts into a single HTML file.

Community
Advanced
zli5460zli5460
2

claude-design

Generate self-contained HTML prototypes with embedded CSS and JS.

Community
Intermediate