skills.rest
Rheasilvia
RheasilviaCOMMUNITY
Explore all skills by this author →
GitHub

claude-design

Generates self-contained HTML, CSS, and JavaScript design artifacts for CLI and API environments.

Updated Jun 25, 2026
Search Tags:#design#ui#html#prototype#ux#design-system#artifact
One-click install
npx skills add https://github.com/Rheasilvia/hermes-desktop --skill claude-design-rheasilvia
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: claude-design
Source: https://github.com/Rheasilvia/hermes-desktop/tree/main/skills/creative/claude-design
Command: npx skills add https://github.com/Rheasilvia/hermes-desktop --skill claude-design-rheasilvia

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill bridges the gap between high-fidelity design requirements and CLI-based agent environments, allowing you to generate professional-grade HTML prototypes, decks, and design systems without needing a hosted web UI.

Core Features & Use Cases

  • Surface-First Design: Enforces compositional discipline by categorizing UI into specific archetypes like Monitor, Operate, or Decide.
  • Artifact Generation: Produces self-contained, responsive HTML/CSS/JS files for landing pages, prototypes, and slide decks.
  • Design System Integration: Supports the creation of token-based design systems and integrates with existing repo styles to ensure visual consistency.

Quick Start

Use the claude-design skill to create a responsive landing page prototype for a new product dashboard.

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 design prototypes in a CLI environment?▼

To generate HTML design prototypes in a CLI environment, use this skill to apply structured design principles and output self-contained HTML, CSS, and JavaScript files for immediate browser verification.

How do I create design system specifications using an API-based agent?▼

Creating design system specifications using an API-based agent involves defining token-based systems and applying compositional archetypes like Monitor, Operate, or Decide to ensure visual consistency across generated artifacts.

Can I build interactive product mockups without a hosted web UI?▼

Yes, you can build interactive product mockups without a hosted web UI by generating self-contained, responsive HTML, CSS, and JavaScript files directly through CLI and API-based agent environments.

Do I need local file system access to generate landing page prototypes?▼

Yes, local file system access is required to generate landing page prototypes, as the skill outputs self-contained HTML, CSS, and JavaScript files locally for immediate browser-based verification.

What is surface-first design and how does it apply to UI generation?▼

Surface-first design applies to UI generation by enforcing compositional discipline, categorizing interfaces into specific archetypes like Monitor, Operate, or Decide before producing the final high-fidelity HTML artifacts.

Are there limitations when creating slide decks in CLI agent environments?▼

Limitations when creating slide decks in CLI agent environments include the necessity of local file system access to output the self-contained HTML, CSS, and JavaScript files required for browser-based viewing.

Related Skills

Explore More Design & Creative Skills→
paxlabs-incpaxlabs-inc
7

claude-design

Generate self-contained HTML design artifacts with CSS and JavaScript.

Community
Advanced
cxnaivecxnaive

claude-design

Generate self-contained HTML design artifacts and prototypes in CLI and API environments.

Community
Advanced
AshesOfTheUndeadAshesOfTheUndead

Design Skill

Route design-related HTML artifact tasks to specialized sub-skills.

Community
Advanced
freedomw1987freedomw1987
2

claude-design

Generate self-contained HTML design artifacts in CLI or API environments.

Community
Intermediate