> ## Documentation Index
> Fetch the complete documentation index at: https://kindling.birklid.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Huashu Design

> AI agent skill for generating high-fidelity interactive prototypes, slide decks, motion design, and infographics from natural language.

<div style={{display: "flex", gap: "8px", marginBottom: "1.5rem", flexWrap: "wrap"}}>
  <Badge>Open Source</Badge>
  <Badge color="#F97316">Applications Layer</Badge>
</div>

# Huashu Design

**Produce interactive prototypes, HTML slides, motion graphics, and infographics from a text prompt — informed by 20+ design philosophies.**

<Frame>
  <img src="https://mintcdn.com/tumbleweedlabs/QT0SlrwbzlJBSMcS/images/og-huashu-design.png?fit=max&auto=format&n=QT0SlrwbzlJBSMcS&q=85&s=6ec0e301ce598cfd99927acdbe4370f8" alt="Huashu Design GitHub" width="1200" height="600" data-path="images/og-huashu-design.png" />
</Frame>

<CardGroup cols={4}>
  <Card title="Type" icon="code-branch">Open Source (Personal Use)</Card>
  <Card title="Stack Layer" icon="browsers">Applications</Card>
  <Card title="Language" icon="code">HTML</Card>
  <Card title="Stars" icon="star">12.8k+</Card>
</CardGroup>

## What it is

Huashu Design is an agent skill for Claude Code that converts natural language descriptions into high-fidelity design artifacts: clickable iOS and web prototypes, HTML slide decks exportable to PPTX, motion design as MP4 or GIF, and static infographics. It applies a built-in set of 20+ design philosophies — covering layout, typography, color, and motion principles — and includes a 5-dimension expert critique tool that evaluates and iterates on generated designs.

The HTML output is self-contained and requires no external dependencies, making it easy to embed in docs or share as standalone files. A commercial license is available separately for production use; the open-source repository is for personal and evaluation use.

<Tip>
  **Use this when** you need production-ready interactive design artifacts from text descriptions — especially useful for validating product concepts, generating pitch deck visuals, or rapid prototyping without opening Figma or After Effects.
</Tip>

## Get started

<CardGroup cols={2}>
  <Card title="GitHub ↗" icon="github" href="https://github.com/alchaincyf/huashu-design">
    Source, examples, and installation for personal use.
  </Card>
</CardGroup>

## Related tools

<CardGroup cols={2}>
  <Card title="Frontend Slides" icon="github" href="/library/skills/frontend-slides">
    Claude skill for animated HTML presentations from outlines or PPTX.
  </Card>

  <Card title="tweakcn" icon="globe" href="/library/design/tweakcn">
    Visual theme editor and generator for shadcn/ui components.
  </Card>
</CardGroup>