claude-design

Design custom HTML artifacts like landing pages and prototypes.

Updated May 9, 2026
One-click install
npx skills add https://github.com/LuminaVault/LuminaVaultServer --skill claude-design-luminavault
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: claude-design
Source: https://github.com/LuminaVault/LuminaVaultServer/tree/main/Sources/App/Resources/Skills/creative/claude-design
Command: npx skills add https://github.com/LuminaVault/LuminaVaultServer --skill claude-design-luminavault

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill addresses the need for creating one-off HTML artifacts such as landing pages, prototypes, and decks, providing design process and taste guidance without the need for a hosted web UI.

Core Features & Use Cases

  • Design Process Guidance: Offers a structured approach to design, including gathering context, defining design systems, and choosing the right format.
  • HTML Artifact Creation: Generates self-contained HTML files with embedded CSS and JavaScript, suitable for various design deliverables.
  • Use Case: When a user needs a custom landing page or a high-fidelity prototype, this Skill can guide the design process and create the artifact.

Quick Start

Use the claude-design skill to create a landing page for a new product, specifying the target audience and desired fidelity level.

Frequently Asked Questions about claude-design

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

FAQPage Schema
How do I generate a custom HTML landing page or prototype from a design prompt?▼

This Skill creates custom HTML artifacts like landing pages and prototypes by applying a structured design process that gathers context, defines design systems, and outputs self-contained HTML files with embedded CSS and JavaScript.

What is the process for designing one-off HTML artifacts without a web UI?▼

Designing one-off HTML artifacts without a hosted web UI involves following a structured design process that gathers context, defines design systems, selects formats, and generates self-contained HTML files with embedded code.

Can I use this to create a high-fidelity design deck in HTML format?▼

Yes, you can create high-fidelity design decks in HTML format. This Skill supports generating custom HTML artifacts for various design deliverables, including landing pages, prototypes, and presentation decks.

Does the generated HTML artifact include in-page controls for design adjustments?▼

Yes, generated HTML artifacts include in-page controls for design adjustments. This allows you to fine-tune the design directly within the output without needing to modify the underlying HTML, CSS, or JavaScript code manually.

Do I need a specific hosted web UI to design custom HTML artifacts?▼

No, a hosted web UI is not required to design custom HTML artifacts. This Skill operates within CLI and API environments, generating self-contained HTML files directly without requiring a separate visual interface.

What's the best way to build a self-contained HTML file with embedded CSS and JavaScript for a prototype?▼

The best way to build a self-contained HTML file with embedded CSS and JavaScript for a prototype is to follow a structured design process that defines the design system first, then outputs the complete artifact in a single file.