OpenClaw Design Spec Generator - 让AI Agent懂你的设计风格

✨ 核心功能

🎨 生成 DESIGN.md

从网站URL或描述自动提取设计系统，生成完整 DESIGN.md 文件，让 AI Agent 理解你的品牌风格。

📋 多主题模板

内置 5 套专业设计模板：妙趣风格 / 暗黑模式 / 企业 / 极客 / 默认，一键生成。

🔄 跨项目同步

读取已有设计规范，同步到多个 OpenClaw 项目，保持品牌一致性。

🧪 预览验证

检查 Agent 生成结果是否符合设计规范，输出合规性评分报告。

🚀 快速开始

# 1. 克隆到 skills 目录
cp -r openclaw-design-spec-generator ~/.openclaw/skills/

# 2. 生成妙趣风格设计规范
./spec-gen.sh --template miaoquai --output DESIGN.md

# 3. 从网站URL提取
./spec-gen.sh --url https://miaoquai.com --output DESIGN.md

# 4. 预览设计规范
./spec-gen.sh --template dark-mode --preview

# 5. 告诉 Agent:
"按 DESIGN.md 的设计规范生成页面"

🎭 设计模板

🤪

妙趣风格

周星驰无厘头 + 王家卫式哲理，活力橙配色

🌙

暗黑模式

深色背景，适合开发者工具和夜间模式

🏢

企业风格

专业稳重，适合 B2B SaaS 和企业官网

🤓

极客风格

终端风格，Matrix 绿，适合技术博客

🎨

默认现代

现代简洁，适合大多数 Web 项目

💡 灵感来源 (GitHub Trending)

22K⭐ +1,542/天
google-labs-code/design.md
A format specification for describing a visual identity to coding agents
57K⭐ +167/天
Fission-AI/OpenSpec
Spec-driven development (SDD) for AI coding assistants
3.3K⭐ +230/天
every-app/open-seo
Open source alternative to Semrush and Ahrefs

📄 输出示例 (DESIGN.md)

# Design System for Miaoquai

## Brand Identity
- **风格**: 妙趣横生 - 周星驰无厘头 + 王家卫式哲理
- **Primary Color**: #FF6B35 (活力橙)
- **Secondary Color**: #4ECDC4 (薄荷绿)
- **Font**: Noto Sans SC, sans-serif

## Component Specs

### Tool Cards
- 圆角: 12px
- 阴影: 0 4px 20px rgba(0,0,0,0.08)
- 悬停效果: translateY(-4px)
- 标题: 16px bold, #2C3E50

准备好让 AI Agent 懂你的设计了吗？

立即下载 OpenClaw Design Spec Generator，开始生成你的设计规范！

📥 下载工具 (GitHub) 🌐 访问妙趣AI

🎨 OpenClaw Design Spec Generator