📦 Vizboard — 一键生成HTML仪表板

v1.0.0

将代码仓库数据秒变自包含HTML仪表板：架构图、流程图、KPI看板、数据表、Diff对比等，响应式布局+明暗双主题，零外部依赖，一键生成即删，干净无残留。

0· 46·0 当前·0 累计

by @redf426

开发工具数据分析生产力工具文档工具数据处理

下载技能包

最后更新

2026/4/13

安全扫描

VirusTotal

无害

查看报告

OpenClaw

可疑

medium confidence

该技能行为基本符合其声明用途（从仓库生成自包含HTML可视化），但运行时指令存在若干不一致及隐私敏感操作（读取agent内存路径、可选调用外部'surf gemini' CLI、关于外部CDN的矛盾指引），启用前请充分理解。

评估建议

This skill mostly does what it says (reads a repo, runs git, and generates self-contained HTML reviews), but there are a few things to check before installing or enabling it: - Privacy of agent memory: the prompts explicitly point the agent at files like ~/.agent/memory/... and ~/.pi/agent/memory/.... Those paths may contain private conversation history or other sensitive state. If you don't want the skill to read agent memory, don't enable it or remove those references from the templates. - E...

详细分析 ▾

ℹ 用途与能力

Name/description (HTML dashboards, diffs, diagrams) align with the skill's instructions to read the repo, run git commands, and render templates. However there are a few mismatches: the SKILL.md hard rule says 'HTML must be fully self-contained (inline CSS/JS, no external assets)' while references/libraries.md documents using CDN-hosted Mermaid and ELK imports. Also the skill reads agent-specific memory paths (e.g., ~/.agent/memory and ~/.pi/agent/memory) which are not obviously required by a visualization generator and could expose sensitive conversational memory.

⚠ 指令范围

The SKILL.md and prompts instruct the agent to run shell/git commands (git diff, git show, gh pr diff), read many repository files, and read agent memory files in home-directory paths. They also describe saving files under ~/.agent/diagrams and copying them into the workspace to 'send' via message(action="send", filePath="./..."), then removing them. Optional behavior includes invoking a local 'surf' CLI (surf gemini --generate-image) that may call an external image-generation service. These actions are broadly consistent with a diff/plan reviewer, but they grant access to user home directories and agent memory and allow optional external network interactions — these are sensitive and not declared as explicit requirements.

✓ 安装机制

Instruction-only skill with no install spec and no code files. That minimizes supply-chain risk: nothing is downloaded or written by an installer. All behavior is driven by runtime instructions and included templates, which the agent will use if invoked.

⚠ 凭证需求

The skill declares no required env vars or external credentials (good), but the instructions read files under ~/.agent and ~/.pi (agent memory) and run system commands. Accessing agent memory paths is disproportionate relative to a neutral diagram generator and may expose private conversation context or stored tokens. The prompts also suggest optionally using external CDNs or an external 'surf' CLI to generate images; both could transmit content outside the user's environment if invoked. These data-access behaviors are not surfaced as explicit requirements in the metadata.

ℹ 持久化与权限

always:false (not force-included) and there is no install. The skill writes output to ~/.agent/diagrams and uses temporary workspace copies for sending then removes them — this is a modest, explained persistence model. It does not claim to modify other skills or system-wide config. Because the skill can be invoked autonomously by the agent (platform default), the combination of autonomous invocation + the file and memory paths accessed increases the surface for accidental disclosure; treat autonomous invocation as you would other powerful skills.

安全有层次，运行前请审查代码。

运行时依赖

无特殊依赖

版本

latestv1.0.02026/4/13

vizboard初始发布：生成美观、自包含的HTML仪表板与技术页面。 - 支持架构图、流程图（Mermaid）、KPI仪表板、数据表、对比视图等HTML可视化。 - 默认将复杂ASCII表格（≥4行或≥3列）替换为响应式、带样式的HTML表格。 - 干净交付工作流：每次用户请求自动生成、发送并自动清理HTML文件。 - 所有输出采用响应式布局、语义结构，并支持明暗模式。 - 严格规则：禁用ASCII艺术，确保HTML完全自包含（无外部资源）。

● 无害

安装命令

点击复制

官方npx clawhub@latest install vizboard

镜像加速npx clawhub@latest install vizboard --registry https://cn.longxiaskill.com

技能文档

# Vizboard ## 目标生成独立的 HTML 页面，用于可视化解释架构、计划、差异、数据表和 KPI 仪表板。 ## 硬规则 - 启用此技能时，绝不使用 ASCII 艺术。 - 包含 4+ 行 或 3+ 列 的表格必须始终主动渲染为 HTML。 - HTML 必须完全自包含（内联 CSS/JS，无外部资源）。 - 生成后务必将文件交付给用户。 ## 工作流 1. 确定可视化类型：architecture、flowchart、sequence、table、dashboard。 2. 选择模板： - templates/architecture.html - templates/mermaid-flowchart.html - templates/data-table.html 3. 对于大型/复杂图表，使用 Mermaid + themeVariables。 4. 对于表格数据，使用语义化 references/libraries.md~agent/diagrams/.html生成后，务必将文件交付给用户：cp ~/.agent/diagrams/.html ./.htmlmessage(action="send", filePath="./.html", message="")rm ./.htmlNO_REPLY切勿跳过第 2 步切勿跳过第 3 步references/css-patterns.mdreferences/libraries.mdreferences/responsive-nav.mdprompts/*.md

。 5. 通过 CSS 变量应用样式（使用有意设计的调色板，而非默认）。 6. 验证响应式布局，确保无溢出。 ## 渲染指南 - 架构（文本较多）：CSS grid + cards。 - 拓扑/流程/状态/序列：Mermaid。 - 数据表/审计/对比：带粘性表头的 HTML 表格。 - KPI/仪表板：grid + 可选的图表库，见 。 ## 输出与交付 保存路径： -  1. 复制到工作区： 2. 发送： 3. 清理： 4. 发送后回复  —— 用户期望在聊天中收到文件，而不仅仅是文件路径。  —— 工作区文件会累积。 ## 质量门槛 - 清晰的视觉层次。 - 无截断文本或容器。 - 支持浅色/深色模式。 - Mermaid 块可读；大型图表具备缩放/平移功能。 - 内容准确反映用户实际请求 —— 无填充或样板。 ## 参考资料 -  —— 布局、溢出、缩放控制。 -  —— Mermaid/Chart.js/anime.js 用法。 -  —— 长页面导航。 -  —— 现成场景（diff-review、plan-review、fact-check、project-recap）。

数据来源：ClawHub ↗ · 中文优化：龙虾技能库