Huashu Design

Design Studio AI is an open-source, agent-first design workspace for humans and AI agents. It supports web interfaces, slides, reports, wireframes, 3D scenes, and timeline videos; users start from a brief or template, inspect a preview, revise through chat or a manual editor, and work together on the same versioned document. The workspace provides structured flex/grid layouts, reusable design systems, 2D character motion, editable 3D scenes, BYOK text/image/speech/music/video generation, and exports including JSON, HTML, SVG, PNG, PDF, PowerPoint, WebM, GLB/glTF, React prototype ZIPs, and authorized Google Slides. It exposes REST, authenticated MCP, experimental WebMCP, and a CLI for agent access, and can run on Cloudflare or be self-hosted with Docker and persistent SQLite/files. The repository is distributed under the MIT license.

Hallmark is an open-source design skill for Claude Code, Cursor, and Codex that applies anti-AI-slop rules to generated interfaces. It selects a macrostructure and one of twenty-one themes for a brief, applies its design rule set, runs fifty-seven anti-pattern gates and a pre-emit self-critique, and returns self-contained HTML and CSS. Its four operations build new UI, audit existing code without editing it, redesign an interface while retaining its copy, information architecture, and brand, or study a screenshot or URL to extract macrostructure, type pairing, and a color anchor; the study operation can also emit a portable design.md file. Custom briefs can receive a made-to-measure palette, typography, and layout rather than a catalog theme. Hallmark is made by Together AI and distributed under the MIT license.

Editable Visual Design is an open-source, coding-agent-driven toolkit for creating editable visual artifacts from prompts. A persistent coding agent interprets a brief, plans a composition, generates assets, implements the design in semantic HTML, renders and observes the result, and applies repairs. An image model supplies visual direction for composition, hierarchy, color, and spatial relationships, while the delivered artifact rebuilds typography and layout in HTML rather than shipping reference pixels. The resulting artifact contains real text, independent assets, selectable and movable layers, a visual editor, rendered PNG output, an animated layer breakdown, and a replayable creation process. Deterministic checks cover the canvas, fonts, layer contracts, rendering, and editor round trips. The repository distributes the workflow as two Codex skills, including editable-design for fixed-canvas designs and a separate html-to-pptx skill for converting compatible HTML designs into editable presentations.

An MIT-licensed Claude Code skill that applies concrete design rules from Refactoring UI by Adam Wathan and Steve Schoger when building or reviewing interfaces. It selects spacing, typography, color, shadow, and radius values from fixed scales; creates hierarchy through font weight and color rather than relying on larger text; and translates subjective issues such as an interface looking "off" into specific mechanical fixes. The repository includes a SKILL.md procedure, references for palette construction, diagnosis, depth, typefaces, grids, and images, plus a contrast-verified starter tokens.css file. Claude Code can load it as a personal or project skill, and it does not include the book's text or images.