無料・ブラウザで完結・登録不要

三角関係相関図を、
かわいく作れる無料ツール

アニメ・漫画・ドラマのキャラクター相関図から、友人関係や組織図、SNSで映える三角関係ネタまで。 画像をアップロードして、矢印と「好き」「嫌い」「ライバル」などの関係ラベルをつけるだけ。 できあがった関係図はスクショモードでかんたんに画像保存できます。

♡ 好き ? 気になる ⚡ ライバル 🌸 ひな 🐱 かいと れん

できること

相関図・関係図づくりに必要な機能をひと通り揃えました。専門ソフト不要、ブラウザだけでOK。

📷

画像アップロードでキャラ設定

推しや登場人物の画像をアップして丸・四角・吹き出しの形でアイコン化。絵文字や色つきの丸でも作れます。

↔️

6種類の矢印スタイル

片方向・両方向・ハート付き・ヒビ割れ・点線・波線。関係性のニュアンスに合わせて使い分けられます。

🎨

矢印を自由に曲げる 🖥 PC版のみ

矢印の線をドラッグすると、カーブのふくらみを自由に調整可能。込み入った相関図も見やすく整理できます。

🫧

グループで囲んで表示 🖥 PC版のみ

仲間・チーム・派閥などを、パステルカラーのふんわりした囲みで可視化。離れたメンバーも「ぷにょん」とつながる演出で、関係性が一目瞭然。

📝

書き込みで注釈を入れる 🖥 PC版のみ

手書き風のひとことメモを自由に配置。色・サイズ・角度も自由自在。ノードや矢印に点線でリンクでき、ひとつのメモから複数つなげるのもOK。コメントやツッコミ演出に◎

関係ラベル&スタンプ

「好き」「嫌い」「ライバル」「信頼」「気になる」をプリセット。自由入力やスタンプ(♡✕★など)の装飾も可能。

🧩

ノードは好きなだけ追加

三角関係だけじゃない。4人・5人…人数制限なし。複雑な人間関係図もドラッグで自由に配置できます。

📸

ワンタッチのスクショモード

完成した相関図はUIを全隠ししてすぐにスクリーンショット可能。SNSへの投稿や資料への貼り付けがはかどります。

Undo / Redo & サンプル

Ctrl+Z / Y で操作を戻せます。サンプル相関図を読み込めば、空白から始めずにすぐ編集を体験できます。

💾

作業ファイルの保存 / 読み込み

作成した相関図を .sankaku.json 形式で保存。別の日に開き直して続きから編集できます。アップロードした画像もまるごと含まれます。
書き出しは PC・スマホ両対応読み込みは PC 限定。スマホで作って PC で仕上げるフローも可能です。

🔄

自動バックアップ

編集内容はブラウザに自動保存。うっかりタブを閉じても、次に開いたとき前回の状態が復元されます。

PC版とスマホ版の違い

スマホ版は「思いついた時にパッと作る」ためのライト版。本格的に編集したいときは PC 版(または大画面タブレット)がおすすめです。

機能
🖥 PC版
📱 スマホ版
基本の相関図作成・編集
画像・絵文字・色のカスタマイズ
関係ラベル・矢印スタイル(6種)
スクリーンショット保存
自動バックアップ
🎨 矢印のカーブ調整
🫧 グループ(囲み表示)
📝 書き込み(注釈テキスト)
💾 作業ファイル(.sankaku.json) 書き出し
📂 作業ファイル(.sankaku.json) 読み込み

.sankaku.json書き出しは PC・スマホ両方で可能ですが、読み込みは PC 限定です。スマホで作った続きを PC で仕上げたい時は、スマホで「+ その他 > 💾 PC 編集用に書き出し」、PC で「💾 ▾ > 📂 作業ファイルを開く」から読み込んでください。

1使い方はかんたん5ステップ

はじめての方でも、数分で相関図が完成します。

1

ノードを追加する

右上の「+ ノード」で人物やキャラを追加。名前とひと言コメントをつけられます。

2

アイコンを設定

画像をアップロードするか、絵文字や色つきの丸から選択。形もまる・四角・吹き出しから変えられます。

3

関係線でつなぐ

ノードにカーソルを合わせると右上にマーク。相手のノードへドラッグするだけで関係線が引けます。

4

関係と矢印をカスタム

線をクリックして、「好き/嫌い/ライバル」などの関係ラベル、矢印スタイル、色、スタンプ装飾を設定。

5

スクショで画像に

ツールバー右端の「📸 スクショ」を押すと不要なUIが隠れます。あとはお手元の端末のスクリーンショット機能で保存するだけ。

🫧グループ機能の使い方 🖥 PC版のみ

仲間・チーム・派閥などをふんわりした色つきの囲みでまとめて、関係性をもっと分かりやすく可視化できます。

1

ノードを選んで「🫧 グループに入れる」

キャラをクリックすると右側パネル下部に表示されるボタンをタップ。そのキャラを最初のメンバーとして新しいグループが作られます。

2

仲間になるノードをクリック

画面上部に「🫧 グループ編集中」バーが表示されている間は、ノードをクリックするたびにメンバー追加/除外がトグル。色つきの囲みが即時プレビュー。

3

「完了」で確定

バーの「完了」ボタン(または Esc キー)で編集モード終了。グループが選択された状態になり、詳細編集パネルに切り替わります。

4

名前・色・ラベル位置をカスタム

右側パネルでグループ名、色(カスタムカラーも OK)、名前の表示 ON/OFF を調整。名前ラベルはドラッグで好きな位置に移動できます。

5

複数グループにも所属 OK

1 人のキャラは複数のグループに同時所属できます。「1組」+「バスケ部」のような複層的な人間関係もそのまま表現。不要になったら右側パネルの × で個別に外せます。

こんな場面で使えます

三角関係や相関図を「ぱっと見でわかる形」にしたい人のためのツール。用途はこんなに。

📺

アニメ・漫画のキャラ相関図

推しカプやファン考察の整理、作品紹介記事に。

🎬

ドラマ・映画の登場人物マップ

長編ドラマの関係性をひとめで把握できる図に。

✍️

小説・創作の設定資料

登場人物の好き・嫌い・ライバル関係を整理。

🏫

クラス・サークルの人間関係

身近な人間模様をゆるいイラスト感覚で可視化。

📱

SNSでバズる三角関係ネタ

X(旧Twitter)やインスタで映えるかわいい相関図に。

🎓

歴史・物語の人物関係

歴史上の人物や神話の関係性を学習教材として。

💼

組織図・ステークホルダーマップ

チーム内の関係性や取引先との関係を可視化。

🎮

ゲームキャラの相関図

大人数RPGや乙女ゲームのキャラ関係整理に。

関係ラベルと矢印スタイル

プリセットされた関係ラベル(自由入力も可)と、6種類の矢印スタイルが使えます。

関係ラベル

好き

恋愛感情・好意

嫌い

苦手・嫌悪

ライバル

競争・張り合い

信頼

友情・信頼関係

?

気になる

興味・ちょっと好き

自由入力

「親友」「元カレ」など自分で

矢印スタイル

片方向矢印

一方的な感情や行動の向き。

両方向矢印

相互の関係・両想いなどに。

ハート付き

両想い・強い好意の表現に。

ヒビ割れ

関係の破綻・亀裂を表現。

点線

あいまいな関係・ほのかな感情。

波線

不安定・ゆらぎのある関係性。

💡覚えておくと便利な小技 🖥 PC版

知っていると操作がぐっと快適になる、ちょっとした機能たち。

矢印の線をドラッグ
カーブのふくらみを自由に調整できます。込み入った相関図のラベル位置もスッキリ整理。
矢印選択中に Shift + クリック
別の矢印をクリックで、2 本の重なり順を入れ替え。ラベルが隠れて見えない時に便利。
グループ名ラベルをドラッグ
ラベルを好きな位置に移動。ノードと重なって見にくい時に、見やすい場所へ。
Ctrl / + Z / Y
いつもの Undo / Redo。うっかり消しちゃった時も安心。
カラーパレットの 🌈 ボタン
プリセット色以外が欲しい時に。お好みのイメージカラーに合わせたい時などに重宝。

?よくある質問

本当に無料で使えますか?

はい。三角関係ジェネレーターはブラウザ上で動く無料Webツールです。会員登録やインストールも不要で、URLにアクセスするだけでそのまま作成を始められます。

作った相関図は画像で保存できますか?

はい。ツールバーの「📸 スクショ」機能を使えば、ボタンやメニュー等がすべて非表示になり、相関図だけが画面いっぱいに表示されます。あとはお手元のPCやスマートフォンのスクリーンショット機能を使って保存してください。

作業を途中で保存して、あとで再開できますか?

はい。作業ファイル(.sankaku.json)として保存可能で、アップロードした画像もすべて含まれます。
PC:書き出し / 読み込み 両方対応(ツールバーの「💾 ▾」メニュー)
スマホ:書き出しのみ対応(「+ その他」シート >「💾 PC 編集用に書き出し」)
スマホで下書きを作って PC で仕上げる、というフローが可能です。なお、ブラウザへの自動バックアップ(localStorage)は PC・スマホそれぞれのブラウザで個別に動作します(端末間でデータは共有されません。端末をまたぐ場合は .sankaku.json の書き出し/読み込みをご利用ください)。

アップロードした画像はサーバーに送られますか?

いいえ。画像処理はすべてブラウザ内で完結しています。アップロードされた画像はサーバーに送信されず、ブラウザのローカル保存領域に自動バックアップとして一時保存されます。「すべてクリア」で保存データも削除できます。安心してお使いください。

ノードは何個まで作れますか?

技術的な上限はありませんが、読みやすさ・動作の軽快さを考えると20人程度までがおすすめです。それ以上追加しても動作はしますが、関係線が混み合ったり、ドラッグ操作が少し重くなる場合があります。登場人物が多い作品は、主要キャラとサブキャラで相関図を分けて作るとスッキリまとまります。

スマートフォンでも使えますか?

はい、スマホ専用エディタをご用意しています。タップ操作に最適化された下部タブバーUI、キャラ追加・関係作成のガイド付きフロー、UIを隠して端末のスクリーンショットで保存できる「スクショモード」を搭載。PC版と同じ関係ラベルや矢印スタイル、背景パターンがすべて利用できます。緻密な操作や大きい画面での編集にはPC版がおすすめです。

作成した相関図を商用利用できますか?

出力された画像の著作権は作成者(あなた)に帰属します。ただし、以下の点にご注意ください。

アップロード画像:著作権は元の権利者に帰属します。権利関係をご確認のうえご利用ください。

プリセット絵文字:絵文字はご利用中のブラウザ・OS によって描画されるため、実際の絵柄(Apple Color Emoji、Google Noto / Emoji Kitchen、Microsoft Segoe UI Emoji、Samsung、Twemoji など)はそれぞれのベンダーが著作権を保有しており、利用条件も個別に定められています。スクショ画像に埋め込まれた絵文字を商用利用する場合は、描画元ベンダーの利用規約を必ずご確認ください。

詳しくは利用規約をご覧ください。

💕

さっそく三角関係を描いてみよう

準備はもう整っています。ブラウザだけで、かわいい相関図がすぐ作れます。

ジェネレーターを開く →

開発のサポートについて

いつもツールをご利用いただきありがとうございます。開発者の トミナガハルキ です。

皆さまのクリエイティブな活動を少しでもお手伝いできればと、このツールを含め、公開しているほとんどのツールを無料で提供しています。

もしこのツールを気に入っていただけて、「役に立ったよ!」というお気持ちをいただけましたら、一杯のコーヒーを奢るような感覚でサポートをいただけますと幸いです。

いただいたお気持ちは、サイトのサーバー代や開発のエネルギーとして大切に使わせていただきます。

☕ コーヒーを奢る

!免責事項