Typing, Enter, Deliverable: The Claude Code Skill That Outsourced the Design Studio

Huashu-design is an agent-agnostic prompt architecture that turns terminal-based AI assistants into high-fidelity design teams—no Figma, no browser tab, no GUI.
The Terminal as a Design Studio
The origin story is almost too honest to be marketing copy. Huasheng, the Chinese indie developer behind the project, stayed up until four in the morning playing with Anthropic’s Claude Design launch. A few days later, he realized he had not opened it once since. Not because the product was bad—he calls it the most polished tool in the category—but because he would rather talk to an agent in a terminal than open any graphical UI. So he did what any AI-native coder would do: he had an agent deconstruct Claude Design’s system prompts, distill the component mechanics and brand protocols, and rewrite the whole thing as a skill that drops into Claude Code, Cursor, Trae, or any markdown-skill-capable agent.

That skill, huashu-design, has since trended to #1 Repository of the Day on Trendshift and cracked the weekly top ten. The attention spike is easy to explain. In 2026, the AI prototyping market is crowded with slick SaaS front-ends—UX Pilot, Banani, Relume, Google Stitch, Figma AI—each fighting to become the browser tab where ideas become pixels. Huashu-design ignores the browser entirely. It is a folder of markdown instructions, reference documents, and export scripts that lives inside your agent’s context window. You type a sentence; the agent returns a single-file HTML prototype, an MP4 motion piece, an editable PowerPoint deck, or a print-grade infographic. The graphics tool layer, in the author’s framing, simply disappears.
A Skill, Not an App
To understand why this matters, you have to understand the skill format itself. In the Claude Code ecosystem, a skill is not a plug-in or a binary. It is a progressive-disclosure architecture: a metadata header that costs roughly a hundred tokens, a main instruction document under five thousand tokens, and bundled resources—scripts, components, style references—that load only when the agent decides they are relevant. This keeps the context window lean while allowing deep specialization. The awesome-claude-skills repository, which curates these configurations, treats them as repeatable workflows rather than software products.
Huashu-design sits in that same layer. It is skills.sh-compatible and agent-agnostic, advertising support for Claude Code, Cursor, Codex, Hermes, and OpenClaw. Where Claude Design is a web product locked to Claude.ai with subscription quotas and a GUI canvas, huashu-design is a protocol. It consumes API tokens, not seat licenses, and it outputs HTML, MP4, GIF, PDF, and—crucially—editable PPTX files generated by a custom html2pptx.js translator that reads DOM computed styles and writes real PowerPoint text frames instead of screenshot beds. The trade-off is immediate: you lose drag-and-drop layer editing, but you also lose the context switch of leaving your IDE.
The Anti-Slop Discipline
If huashu-design were just a prompt that says “make pretty web pages,” it would be indistinguishable from the flood of AI design tools that already exist. Its real engineering is procedural. The skill is essentially a quality-control system wrapped in markdown, enforcing a design process that many human junior designers skip.
The hardest rule is the Core Asset Protocol. Whenever a task touches a specific brand—Stripe, Linear, DJI, a client’s startup—the agent must execute five steps: ask for six asset types (logo, product shots, UI screenshots, color palette, fonts, guidelines); search official press and brand channels; download assets with three fallback paths per category; verify fidelity and grep real hex values from actual assets rather than hallucinating from training-corpus memory; and finally freeze everything into a brand-spec.md file. The author A/B tested this: v2 with the protocol reduced stability variance across six agents by a factor of five. Stability of stability, he notes, is the actual moat.
Then there is Principle #0: Fact Verification First. If the prompt mentions a specific product like “DJI Pocket 4,” the agent must run a web search to confirm existence, release status, and specs before drawing a single div. The cost of a search is about ten seconds; the cost of a wrong assumption is one to two hours of rework. This rule was added after a real failure mode, and it reads like the kind of operational detail that only comes from shipping against real deadlines.
The skill also enforces a Junior Designer Workflow: no heroic one-shot attempts. The agent writes assumptions and placeholders directly into the HTML, shows gray-block early drafts to the user for feedback, and iterates through content, variations, and tweaks before running Playwright click tests prior to delivery. There is even a fallback mode for vague briefs: the Design Direction Advisor, which recommends three differentiated directions drawn from five schools and twenty philosophies, generates visual demos in parallel, and lets the user pick before proceeding.
Most telling is the Anti AI-Slop ruleset. The skill explicitly bans the visual common denominator of current LLM output: purple gradients, emoji icons, rounded-corner-left-border accents, SVG humans, Inter-as-display type, and CSS silhouettes standing in for real product photography. Instead it mandates text-wrap: pretty, CSS Grid, oklch colors, and carefully chosen serif display faces. This is not aesthetic preference; it is a recognition that default model outputs have become a genre, and the skill’s value is partly in escaping that genre.
HTML-Native Outputs in a Figma World
The deliverables are deliberately HTML-native. An iOS app prototype arrives as a single HTML file wrapped in a pixel-accurate iPhone 15 Pro bezel with Dynamic Island and Home Indicator, state-driven multi-screen navigation, and real images pulled from Wikimedia or Unsplash. Slide decks render in the browser but export through html2pptx.js into actual PowerPoint objects with preserved text frames. Motion design uses a Stage-plus-Sprite time-slice model with four APIs—useTime, useSprite, interpolate, and Easing—to generate MP4, GIF, 60fps-interpolated, and BGM-scored finals without touching After Effects.
This HTML-first approach is both the project’s liberation and its ceiling. Because everything is a web render, the skill can leverage standard browser typography, CSS Grid layouts, and Playwright verification. But as the author admits, there is no layer-editable round-trip to Figma or Keynote. Complex 3D physics, particle systems, and Framer-Motion-tier animations are out of scope. And if you ask it to design a brand from zero without any assets, the quality drops to a self-assessed 60–65 points. It is, by the creator’s own admission, an 80-point skill, not a 100-point product.
The 80-Point Moat
That honesty is refreshing in a landscape where every new repo claims to obsolete the last. The broader AI prototyping field is full of well-funded contenders. GoPractice’s head-to-head tests of seven tools on a Slack messenger clone found wide performance variation in speed, interactivity, and handoff quality. Banani and UX Pilot market themselves as full-stack co-pilots with Figma-native export. Lovable targets developers with production-ready React. Against that backdrop, huashu-design’s pitch is almost contrarian: it does not try to be the best graphics tool. It tries to be the best graphics tool for people who refuse to open one.
The project is also embedded in a larger skills collection. Huasheng maintains huashu-skills, a suite of over twenty content-creation skills covering slide decks, data analysis, Douyin scriptwriting, and AI-proofreading. Combined with his track record—Cat Fill Light hit #1 on the App Store paid chart, and his Nüwa.skill holds 21,000 stars—this suggests huashu-design is not a one-off experiment but part of a sustained bet on agent-native workflows.
In May 2026, the project was relicensed from a restrictive personal-use license to MIT, clearing commercial use without authorization. That shift matters because skills are, by nature, derivative. The Core Asset Protocol’s philosophy was explicitly lifted from Anthropic’s Claude Design prompts. The author calls this “the new form of open-source culture in the AI era”: deconstructing a proprietary product’s system logic, generalizing it into an interoperable protocol, and releasing it back to the terminal.
Whether that culture scales is an open question. The skills marketplace is still nascent—curated lists like awesome-claude-skills and directories like aitmpl.com are only beginning to catalog the long tail of agent configurations. As SaaS prototyping tools improve their own fidelity and handoff quality, the terminal-native approach may remain a developer niche. But for that niche, huashu-design offers a compelling contract: stay in your shell, type a sentence, and get something that looks like a real design team made it. Not because the AI is magic, but because the process rules are ruthlessly specific.
Sources
- My 9 Best AI Prototyping Tools in 2026
- Claude Code Skills: Pre-built Templates & Configurations
- Huashu Design download
- Best Prototyping Tools in 2026 are AI-powered. Here's My Top 10.
- Using Claude code to build a website, what “skills” should use?
- Huashu Design vs Claude Design: Head-to-Head Test ...
- We tested 7 tools for AI prototyping—here are the results - GoPractice
- What are favorite Claude skills for custom website design?
- alchaincyf/huashu-design — GitHub trending stats & insights
- 11 Best AI Coding Tools for Data Science & ML in 2026
- travisvn/awesome-claude-skills: A curated list of ...
- alchaincyf/huashu-skills: 花叔的内容创作Skills 合集- AI审校 ...