---
title: "MermaidKit"
description: "純粋な Swift で書かれたネイティブ Mermaid レンダラー。JavaScript なし、WebView なし、依存ゼロ。全30種のダイアグラムを6プラットフォームでバイト単位まで同一の出力で描画。"
canonical_url: "https://2389.ai/ja/research/products/mermaidkit/"
last_updated: "2026-08-25T13:00:12-05:00"
doc_version: "1.0"
date: 2026-09-01
product_type: "Tool"
status: "Beta"
tags: ["swift", "mermaid", "diagrams", "rendering", "cross-platform", "ios", "macos", "android", "open-source"]
---

# MermaidKit

> 純粋な Swift で書かれたネイティブ Mermaid レンダラー。JavaScript なし、WebView なし、依存ゼロ。全30種のダイアグラムを6プラットフォームでバイト単位まで同一の出力で描画。


MermaidKit は純粋な Swift で書かれたネイティブ Mermaid レンダラーです。JavaScript なし、WebView なし、依存ゼロ。Mermaid ソースを渡すと、描画済みのダイアグラムが同期的に返ってきます。パースとレイアウトは Apple シリコン上で通常15ミリ秒以内に完了します。箱から箱へ矢印を1本引くためだけにブラウザを丸ごと組み込むのに、うんざりしたから作りました。

## インストール

タグ付きリリースは Swift Package Manager でインストールできます:

```swift
.package(url: "https://github.com/2389-research/MermaidKit", from: "2.2.0")
```

Apple プラットフォームでの描画には `MermaidRender` を、プラットフォーム非依存のパースとレイアウトだけなら `MermaidLayout` をリンクしてください。Android、Windows/.NET、Flutter、WebAssembly は同じコアを C ABI 経由で利用します。各バインディングは [README](https://github.com/2389-research/MermaidKit) に説明があります。

SwiftUI では、ダイアグラムはビュー1つです:

```swift
MermaidView("""
flowchart TD
    A[Start] --> B{Choice}
    B -->|yes| C[Do it]
    B -->|no| D[Skip]
""")
```

## できること

**全30種の Mermaid ダイアグラム。** フローチャート、シーケンス図、ガントチャート、ER 図、状態遷移図、サンキー図、その他すべて。全種類が[ギャラリー](https://2389-research.github.io/MermaidKit/#gallery)で、ライトとダークの両方で、MermaidKit 自身によって描画されています。

**6プラットフォーム、バイト単位まで同一の出力。** 1つの Swift コアがダイアグラムをパースし、すべての箱、矢印、ラベルの位置を計算し、完成したレイアウトを SceneWire という小さな JSON シーン記述として各プラットフォームに渡します。Apple デバイスは CoreGraphics で、Linux は Cairo で、Android・Windows・Flutter は Skia で、ブラウザは SVG または Canvas2D で描画します。コアは決定論的で、5つのコンパイルターゲット全体で出力がバイト単位まで同一であることを自動テストが証明しています。

**ネイティブな振る舞い。** ダイアグラムはライト/ダークモードに追従し、内容に合わせて自身のサイズを決め、結果をキャッシュするので2回目の描画はタダです。パースできない構文は空白の矩形ではなく、読める等幅テキストにフォールバックします。

**Mermaid だけではなく。** 同じパイプラインが Graphviz DOT（入出力両方に対応するので Mermaid と DOT の双方向コンバーターにもなります）、[Dippin](https://dippin.org) の `.dip` パイプラインファイル、SQL DDL（`CREATE TABLE` 文が ER 図になります）、そして生の `git log` 出力（ターミナルにそのまま git グラフとして描画）を受け付けます。

## 制限事項

MermaidKit がカバーするのは各ダイアグラムタイプのコア構文と、日常的に使う多くの拡張です。mermaid.js の完全なコピーではありません。README の[サポート表](https://github.com/2389-research/MermaidKit#supported-diagram-types--honestly)が、何がカバーされているかを正確に示しています。`classDef` のようなスタイル指定はエラーにならずスキップされます。テーマ処理はネイティブ側が担うからです。すべての変更に対してジオメトリックリンターが走り、線が箱を突き抜けないこと、ラベルが切れないこと、レイアウトが実行ごとに安定していることを検証します。

## 必要要件

- Swift Package Manager 利用者は Swift 6.2+ ツールチェーン
- ランタイム依存なし: JavaScript エンジンなし、WebView なし
- Linux のラスタライズは Silica 経由の Cairo で描画（`LinuxRaster` パッケージトレイトでオプトイン）


## Sitemap

Parent: [プロダクト](https://2389.ai/ja/research/products/index.md)

Related pages in this section:

- [スキルマーケットプレイス](https://2389.ai/ja/research/products/skills-marketplace/index.md)
- [Mammoth](https://2389.ai/ja/research/products/mammoth/index.md)
- [BotBoard](https://2389.ai/ja/research/products/botboard/index.md)
- [Smasher](https://2389.ai/ja/research/products/smasher/index.md)
- [Jeff](https://2389.ai/ja/research/products/jeff/index.md)
- [Mux](https://2389.ai/ja/research/products/mux/index.md)
- [ISH](https://2389.ai/ja/research/products/ish/index.md)
- [Coven](https://2389.ai/ja/research/products/coven/index.md)
- [Soloclaw](https://2389.ai/ja/research/products/soloclaw/index.md)
- [ccvault](https://2389.ai/ja/research/products/ccvault/index.md)


Site index: [llms.txt](https://2389.ai/llms.txt) · [sitemap.md](https://2389.ai/sitemap.md) · [HTML](https://2389.ai/ja/research/products/mermaidkit/)
