---
title: "baoyu-design Brings Anthropic's Claude Design to Any Local Coding Agent"
subtitle: "A community repackage turns Anthropic's Claude Design workspace into a portable Agent Skill that runs inside Cursor, Claude Code, and Codex."
url: "https://alphasignal.ai/news/baoyu-design-brings-anthropic-s-claude-design-to-any-local-coding-agent"
author: "AlphaSignal Newsroom"
author_url: "https://alphasignal.ai/editorial-team"
company: "AlphaSignal"
company_url: "https://alphasignal.ai/company/alphasignal"
published: "2026-07-30T01:41:39.000Z"
updated: "2026-08-22T02:44:08.170Z"
type: "Repo"
topics:
  - "Development"
  - "Vibe Coding"
subtopics:
  - "Code Agents"
  - "Ui Generation"
  - "App Builders"
upvotes: 13
source_url: "https://github.com/JimLiu/baoyu-design"
comments: 0
truncated: true
---

# baoyu-design Brings Anthropic's Claude Design to Any Local Coding Agent

> A community repackage turns Anthropic's Claude Design workspace into a portable Agent Skill that runs inside Cursor, Claude Code, and Codex.

A community project called [baoyu-design](https://github.com/JimLiu/baoyu-design) has reverse-engineered [Claude Design](https://claude.ai/design), Anthropic's hosted UI-generation workspace, and repackaged it as a portable Agent Skill you can drop into any local coding agent. Instead of round-tripping to claude.ai/design, the skill drives your existing editor to produce polished mockups, prototypes, decks, and wireframes as self-contained HTML files that live in your repo.

Anthropic launched Claude Design alongside Claude Opus 4.7, positioning it as a workspace for visual output such as mockups, prototypes, slides, and one-pagers. The hosted product leans on Opus 4.7 for vision and agentic coding. baoyu-design lifts that same methodology out of the browser and makes it runnable against whatever agent you already use.

## What actually lands in your repo

The skill is deliberately low-tech: `SKILL.md` plus a system prompt, per-agent tool references, 24 built-in sub-skills, and a set of starter components. There is no build step and no runtime. When you invoke it, the agent reads `SKILL.md`, detects whether it is running inside Cursor, Claude Code, or Codex, loads the matching reference, and pulls in only the sub-skills the task needs.

_Preview only. Full text requires an AlphaSignal Pro account._

## Sources

- [JimLiu/baoyu-design](https://github.com/JimLiu/baoyu-design)
- [Introducing Agent Skills](https://claude.com/blog/skills)
- [Anthropic just launched Claude Design](https://venturebeat.com/technology/anthropic-just-launched-claude-design-an-ai-tool-that-turns-prompts-into-prototypes-and-challenges-figma)
- [What Is Claude Design?](https://www.datacamp.com/blog/claude-design)