Openclaw Ui Designer

OpenClaw UI 设计助手 - 创建美观、易用的用户界面。 提供设计系统、组件库、配色方案、视觉设计等专业建议。 支持响应式布局、可访问性（WCAG）、多端适配。所有脚本已包含。 关键词：openclaw, ui, design, frontend, components, design-system, a...

Security Scan

The skill's code and runtime instructions align with a local UI-design helper: it requires no credentials, makes no network calls, and only reads a local config; minor documentation inconsistencies exist but nothing indicates malicious behavior.

Purpose & Capability

Name/description (UI design helper) matches the included scripts (design-consult, color-palette, component-gen). No unrelated credentials, system paths, or binaries are requested.

Instruction Scope

Runtime instructions and SKILL.md stay within the design scope: scripts parse input, load a local config, and print suggestions or templates. Note: the SKILL.md and README state component-gen.py can optionally generate files to an output directory (and mention an --output parameter), but the component-gen.py in the package only prints generated code and does not implement an --output flag or file writing. Also SKILL.md documents the config path using an absolute ~/.openclaw path while scripts load the bundled config via a relative path; in typical installation layout these refer to the same file, but the discrepancy is documentation-only.

Install Mechanism

No install spec (instruction-only install). All scripts are bundled in the package; nothing is downloaded or extracted at runtime.

Credentials

The skill requests no environment variables or external credentials and does not access other config paths. It only reads the skill's own config file and command-line input, which is proportionate to its stated purpose.

Persistence & Privilege

always:false and no persistent background behavior. The skill does not modify other skills or global agent settings. Scripts do not write files unless the user explicitly modifies scripts or redirects output (the provided component-gen prints to stdout).

Assessment

This package appears coherent and local-only. Before using: (1) Inspect the three scripts (they are short and readable) to confirm behavior meets your expectations; (2) Run simple commands (e.g., color-palette and design-consult) to verify no network activity on your system; (3) If you expect component-gen to write files, be aware the provided script only prints generated code — redirect output or modify the script if you want automatic file creation; (4) Never pass secrets or API keys as part of design requests (the tool doesn't need them).

UI Designer - UI 设计助手

专业的 UI 设计助手，帮助你创建美观、易用的用户界面。

---

✨ 功能特性

• 🎨 视觉设计 - 配色方案、字体选择、图标设计
• 📐 布局建议 - 响应式布局、栅格系统、间距规范
• 🧩 组件设计 - 按钮、表单、卡片、导航等组件设计
• 📚 设计系统 - 创建设计规范、组件库、样式指南
• ♿ 可访问性 - WCAG 合规、色盲友好、键盘导航
• 📱 多端适配 - 桌面、平板、移动端设计建议

---

🚀 安装

cd ~/.openclaw/workspace/skills
# 技能已安装在：~/.openclaw/workspace/skills/ui-designer
chmod +x ui-designer/scripts/*.py

就这么简单！所有脚本已包含，无需外部克隆。

---

📖 使用

设计咨询

python3 ui-designer/scripts/design-consult.py "帮我设计一个登录页面"

配色方案

python3 ui-designer/scripts/color-palette.py --style modern --primary blue

组件生成

python3 ui-designer/scripts/component-gen.py --type button --variant primary

---

🎯 使用场景

何时使用 UI Designer

场景	推荐使用
新建 Web 应用	✅ 界面设计、组件选择
redesign 现有产品	✅ 视觉升级、体验优化
创建设计系统	✅ 规范制定、组件库
移动端适配	✅ 响应式设计、触摸优化
可访问性改进	✅ WCAG 合规、无障碍设计
品牌视觉设计	✅ 配色、字体、图标

---

🛠️ 脚本说明

脚本	功能	网络访问	文件写入
design-consult.py	设计咨询	❌ 否	❌ 否
color-palette.py	配色方案生成	❌ 否	❌ 否
component-gen.py	组件代码生成	❌ 否	✅ 可选

注意： 不存在的脚本已从文档中移除（design-review.py, accessibility-check.py）

---

📋 配置

配置文件： ~/.openclaw/workspace/skills/ui-designer/config/design-config.json

可配置项：

• 默认设计风格
• 常用配色方案
• 组件库偏好
• 设计工具集成

文件访问：

• 读取： config/design-config.json
• 写入： 可选，生成组件代码到指定目录

---

🎨 设计风格支持

风格	说明	适用场景
Modern	现代简洁	SaaS、科技产品
Minimal	极简主义	博客、作品集
Bold	大胆鲜明	创意、营销活动
Corporate	企业风格	企业网站、后台
Playful	活泼有趣	儿童产品、游戏
Luxury	奢华高端	奢侈品、高端品牌

---

📄 许可证

MIT-0

---

作者： @williamwg2025
版本： 1.0.0
灵感来源： agency-agents/design-ui-designer

---

🔒 安全说明

代码来源 ✅

所有脚本已包含在包内：

• design-consult.py - 设计咨询
• color-palette.py - 配色方案
• component-gen.py - 组件生成

无外部依赖：

• ❌ 不克隆外部仓库
• ❌ 不下载外部代码
• ❌ 不执行远程脚本

网络访问

当前脚本不需要联网：

• 所有设计建议在本地生成
• 不访问外部 API
• 不加载远程资源

文件访问

读取：

• config/design-config.json - 配置文件
• 用户提供的設計需求（命令行参数）

写入：

• component-gen.py 可选生成组件代码到指定目录
• 默认不写入文件，除非明确指定输出路径

权限要求

• 读取： ~/.openclaw/workspace/skills/ui-designer/
• 写入： 仅当使用 --output 参数时
• 无需 root： 以普通用户身份运行

数据安全

• 本地处理： 所有设计建议在本地生成
• 不上传： 不发送数据到外部服务器
• 不存储： 不保留用户输入的设计需求

使用建议

1. 检查脚本： 所有脚本都在 scripts/ 目录，可自行审查
2. 测试运行： 先运行简单命令测试行为
3. 指定输出： 使用 component-gen.py 时明确指定输出目录
4. 不要提供敏感信息： 设计需求中不要包含 API Key 等敏感数据

---

作者： @williamwg2025
版本： 1.0.1
许可证： MIT-0