技能 mermaid

📦

mermaid

Name: mermaid
Author: BfdCampos

内容修订 r2 安全 ⚙️ 外部命令🌐 网络访问

创建适用于 GitHub 的 Mermaid 图表

Mermaid 图表在 GitHub 浅色和深色主题下常常会降低可读性。此技能为 Claude、Codex 和 Claude Code 提供实用的样式规则，用于创建清晰的 Markdown 图表。

支持: Claude Codex Code(CC)

🥉 78 青铜

使用我的智能体安装

将此请求复制给你的智能体，其中包含权威 Skill 页面和清单。

智能体请求

Review the Skillstore skill "mermaid" from https://skillstore.io/skills/bfdcampos-mermaid.md and its manifest at https://skillstore.io/api/skills/bfdcampos-mermaid/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

你的智能体仍应展示其计划，并按安全策略请求必要确认。

Agent 可读资源

当 AI Agent、爬虫或脚本需要干净上下文，而不是读取完整页面时，请使用这些链接。

Markdown 详情 GET /skills/bfdcampos-mermaid.md 已签名 manifest GET /api/skills/bfdcampos-mermaid/manifest 已签名 lockfile GET /api/skills/bfdcampos-mermaid/lockfile

测试它

正在使用“mermaid”。用户提交请求，服务对其进行验证，存储数据，并返回成功结果。

预期结果:

一个主题安全的流程图方案，包含用户节点、验证步骤、存储节点、决策点和成功输出。

正在使用“mermaid”。现有图表使用浅色节点填充、未加引号的 subgraph 标签和 Font Awesome 图标。

预期结果:

一种修正后的图表方案，使用深色节点填充、带引号的标签、基于文本的标签和透明 subgraph。

正在使用“mermaid”。团队希望为 pull requests 和文档制定统一的图表约定。

预期结果:

一份简洁的样式指南，涵盖调色板选择、圆角形状、subgraph 边框和 GitHub Markdown 约束。

安全审计

安全

v9 • 2026/7/23 打开版本化报告

One medium-severity concern is confirmed: the preview workflow uses npx with automatic confirmation and no package version pin. All other detections are false positives caused by Markdown backticks, Mermaid examples, benign metadata, and optional Mermaid Live links.

已扫描文件

268

分析行数

复核项

已忽略误报

能力复核项 (1)

这些是真实的本地能力，对此技能可能是预期行为，因此需要复核，但不会按已确认恶意行为计分。

中

SKILL.md:26-28

Ruby/shell backtick execution

```bash

The fenced block contains `npx -y @mermaid-js/mermaid-cli`, which downloads and executes an unpinned package without confirmation. A compromised latest release could run arbitrary code.

风险因素

⚙️ 外部命令 (50)

🌐 网络访问 (2)

SKILL.md:30 SKILL.md:267

审计者: codex 查看审计历史 →

分享与引用此报告

分享版本化评估报告、中性徽章、嵌入卡片和引用。Skillstore 只报告证据，不判断该 Skill 是否安全。

打开版本化报告

复制报告链接

https://skillstore.io/skills/bfdcampos-mermaid/audits/9?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown 徽章

[![Skillstore security assessment](https://skillstore.io/badges/skills/bfdcampos-mermaid/security.svg)](https://skillstore.io/skills/bfdcampos-mermaid?utm_source=security_passport_badge)

HTML 徽章

<a href="https://skillstore.io/skills/bfdcampos-mermaid?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/bfdcampos-mermaid/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

嵌入卡片

<iframe src="https://skillstore.io/embed/skills/bfdcampos-mermaid.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

学术引用 (APA · BibTeX · CFF)

APA 引用

BfdCampos. (2026). mermaid security audit report (audit version 9) [Author version unspecified]. Skillstore. https://skillstore.io/skills/bfdcampos-mermaid/audits/9

BibTeX 引用

@techreport{bfdcampos-bfdcampos-mermaid-2026,
  author = {BfdCampos},
  title = {mermaid security audit report (audit version 9)},
  institution = {Skillstore},
  year = {2026},
  number = {9},
  url = {https://skillstore.io/skills/bfdcampos-mermaid/audits/9},
  note = {Author version unspecified}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "mermaid security audit report (audit version 9)"
version: "unspecified"
type: report
authors:
  - name: "BfdCampos"
date-released: "2026-07-23"
url: "https://skillstore.io/skills/bfdcampos-mermaid/audits/9"
identifiers:
  - type: other
    value: "skillstore:bfdcampos-mermaid:audit:9"
    description: "Skillstore immutable audit report identifier"

Skillstore 评分

评分依据证据置信度: 高

架构

可维护性

内容

社区

规范符合性

你能构建什么

架构 Pull Request

创建可读的系统流程图，让评审者可以直接在 GitHub pull requests 中查看。

流程文档

将流程步骤转换为整洁的 Mermaid 流程图，并使用一致的颜色和节点形状。

数据管道映射

使用可在浅色和深色主题中正常工作的样式，记录管道阶段、决策和输出。

试试这些提示

创建基础流程图

为此流程创建一个兼容 GitHub 的 Mermaid 流程图：[describe steps]。使用深色填充、浅色描边、圆角节点和带引号的 subgraph 标签。

改进现有图表

检查此 Mermaid 图表是否存在 GitHub 渲染问题。在保留结构的同时，修复 subgraph 标签、节点形状、颜色对比度和不受支持的图标。

记录系统架构

为 [system] 创建一个 Mermaid 架构图。将相关服务分组到透明 subgraph 中，并为用户、服务、存储和结果应用清晰的 class 样式。

标准化图表指南

为我们的仓库生成一份可复用的 Mermaid 样式指南。包括配色组合、节点形状规则、subgraph 样式规则和 GitHub 特定限制。

最佳实践

使用深色节点填充、浅色描边和白色文本，以兼容 GitHub 主题。
为包含空格的 subgraph 标签加引号，以避免 Mermaid 解析错误。
将 class 定义放在靠近顶部的位置，使图表样式保持一致且易于维护。

避免

不要使用 Font Awesome 图标语法，因为 GitHub 会将其渲染为纯文本。
当图表必须在深色模式下正常工作时，不要使用浅色填充和深色文本。
当透明填充可以适配页面背景时，不要使用彩色 subgraph 填充。

常见问题

此技能会自动生成图表吗？

它提供说明和模板，帮助 AI 助手创建 Mermaid 图表。它不包含渲染器。

这些图表能在 GitHub markdown 中工作吗？

该指南专为 GitHub Mermaid 渲染设计，并避免使用不受支持的图标和 HTML 标签。

为什么它推荐使用深色填充？

深色填充配合浅色描边，可以让节点在 GitHub 浅色和深色主题下都保持可读。

我可以使用自定义颜色吗？

可以。该技能建议从同一色系中选择较深的填充色和较浅的描边色。

它支持流程图以外的图表吗？

示例聚焦于流程图。一些样式原则也可能有助于其他 Mermaid 图表类型。

它可以验证 Mermaid 语法吗？

不能。它建议在提交图表之前，先在 Mermaid 预览工具中进行测试。

开发者详情

作者

BfdCampos

许可证

MIT

Skillstore 修订

版本提示

作者未声明版本。

仓库

https://github.com/BfdCampos/dotfiles/tree/main/claude/skills/mermaid

引用

8c3e20bba512c392d9b02ee748b18e0b09d4982c

维护新鲜度

2026/7/24

使用量

9 次下载 · 280 次浏览

文件结构

📄 SKILL.md

BfdCampos 的更多技能

查看全部

📦

pr-description

编写清晰的 Pull Request 描述

当 pull request 缺少上下文、测试证据和图表时，审阅者会浪费时间。此技能指导 Claude、Codex 和 Claude Code 生成结构化的 PR 描述。

文档查看

📦

github-cli

使用 gh 收集 GitHub 上下文

GitHub 工作通常需要 PR、issue、review 和 CI 上下文，而本地 git 无法显示这些内容。此技能指导 Claude、Codex 和 Claude Code 使用 gh 读取命令来获取更丰富的上下文。

DevOps 与基础设施查看

📦

documentation

创建清晰的 Markdown 文档

团队通常需要结构清晰、便于快速审阅的可读文档。此技能指导 Claude、Codex 和 Claude Code 生成清晰的 Markdown 文件。

文档查看

📦

bigquery

安全检查 BigQuery 表

BigQuery 探索可能会暴露敏感行，或产生昂贵的扫描成本。此 skill 指导以元数据优先的 CLI 检查、行数统计、schema 导出以及谨慎采样。

数据与分析查看

📦

apple-mail

使用 AppleScript 自动化 Apple Mail

当邮箱名称各不相同时，手动处理 Apple Mail 任务既缓慢又容易出错。此技能提供用于读取、搜索、发送、回复、移动和删除邮件的 AppleScript 模式。

办公与报告查看

查看全部

📦

mermaid-diagrams

为软件文档创建 Mermaid 图表

由 softaworks

团队通常需要清晰的图表，并且这些图表应与代码和文档保持紧密关联。此技能将指导 Claude、Codex 和 Claude Code 使用 Mermaid 语法创建可维护的可视化模型。

文档查看

📦

c4-architecture

创建 C4 架构图

由 softaworks

架构文档常常会变得不清晰，或对目标受众来说过于详细。此技能可为系统上下文、容器、组件、部署和流程创建聚焦的 C4 Mermaid 图。

文档查看

📦

arch-view

可视化服务架构

由 AstraBit-CPT

当元数据分散在多个仓库中时，分布式服务很难理解。此技能会聚合目录元数据，并为架构评审创建图表、表格和摘要。

文档查看

📦

human-docs

创建面向人类阅读的 AI 文档

由 Brownbull

详细的 AI 上下文文件通常太长，不便于人类快速审阅。此技能会将它们转换为摘要、快速入门和 Mermaid 可视化指南。

文档查看

📦

prd-doc-writer

从产品对话中起草经确认的 PRD

由 yunshu0909

当假设被隐藏或故事不完整时，产品需求往往会失败。此技能会引导需求发现、确认每项决策，并生成包含图表和验收标准的结构化 PRD。

文档查看

📦

c4-modeling

创建 C4 架构图

由 Consiliency

架构文档经常混合不同层级的细节，让利益相关者感到困惑。此技能通过 Mermaid 语法、层级规则和审查检查来指导 C4 图的创建。

文档查看

mermaid

使用我的智能体安装

Agent 可读资源

测试它

安全审计

风险因素

复制报告链接

Markdown 徽章

HTML 徽章

嵌入卡片

APA 引用

BibTeX 引用

CITATION.cff

Skillstore 评分

你能构建什么

架构 Pull Request

流程文档

数据管道映射

试试这些提示

最佳实践

避免

常见问题

开发者详情

BfdCampos 的更多技能

pr-description

github-cli

documentation

bigquery

apple-mail

相关技能

mermaid-diagrams

c4-architecture

arch-view

human-docs

prd-doc-writer

c4-modeling