CodeKitHubこのツールとは？
Discordチャット風画像ジェネレーターは、Discordのチャンネル表示——サーバー名付きの#チャンネルヘッダーと、吹き出しなしでアバター・ロールカラーのユーザー名・タイムスタンプ・下に本文が並ぶフラットなメッセージリストスタイル——を再現するブラウザ内モックアップツールです。
Discordはデフォルトでダークテーマ（#313338風の背景にブループルのアクセント）を採用しており、これは大多数のDiscordユーザーが実際に見ている見た目なので、このジェネレーターもデフォルトでダークモードで開き、任意でライトモードに切り替えられます。
各メッセージ行には独自のユーザー名とそのユーザー名専用のカラーピッカーがあり、Discordがメンバーの表示名を最上位ロールに応じて色分けする仕組みを再現しています——複数の異なるコミュニティメンバー、モデレーター、ボット間の会話をシミュレートできます。
エンタメとデザイン用途に限定：ミームを作ったり、Discordボットの動作を説明したり、コミュニティ運営のコンセプトをモックアップしたり、台本の絵コンテを作ったりできます。実在のサーバーや実在のユーザーになりすましたり、誰かが実際には言っていないことの証拠を捏造したりする用途には絶対に使えません。
入力した内容はあなたの端末から一切外に出ません。会話全体はHTML CanvasのAPIを使ってブラウザ内で直接描画され、PNGファイルもローカルで生成・ダウンロードされます。
なぜこれを使うのか？
- 運営しているコミュニティサーバーの新しい通知Botがどう表示されるかを、実装前にチームに見せて確認したい——実際にBotを組む前に、色付きユーザー名とメッセージレイアウトでモックアップできます。
- 動画編集で「Discordでこんなやり取りがあった」という架空のシーンを差し込みたい——サーバー名・チャンネル名・複数ユーザーの会話を自由に組み立ててPNG書き出しできます。
- コミュニティガイドラインのドキュメントに「モデレーターがこう警告する」という具体例を画像で入れたい——ロールカラー付きのモデレーター名でリアルな警告メッセージ例を作れます。
- 新規メンバー向けのオンボーディング資料に、実際のチャンネルのスクリーンショットのような見た目のサンプル画像を載せたい——ダーク/ライトどちらのテーマにも対応しています。
- 会話の内容に個人情報や社内の機密なやり取りを含めることがある——すべてブラウザのcanvas上で処理され、サーバーには一切送信されません。
使い方
- ヘッダーに表示するサーバー名とチャンネル名を設定します。
- ダークまたはライトテーマを選びます——Discordはデフォルトでダークです。
- メッセージ行を追加します：ユーザー名を入力し、そのユーザー名のロールカラーを選び、タイムスタンプを設定し、メッセージ本文を書きます。
- 好きなだけメッセージとユーザー名を追加して、複数人のチャンネルをシミュレートできます。
- ライブプレビューが更新される様子を確認し、「PNGをダウンロード」をクリックして画像を保存します。
例
入力
サーバー：「Creator Lounge」・チャンネル：「content」・メッセージ1——maya（ブループル）：「おはよう！来週の投稿のモックアップ中、フックを確認してもらえる？」・メッセージ2——devon（緑）：「了解——公開前に見られるようプレビューを置いたよ。」出力
ダークテーマのDiscordチャンネル表示を示すPNG画像：#contentヘッダーの下に2件のメッセージが積み重なり、それぞれ色付きの丸いアバター、ロールカラーのユーザー名とグレーのタイムスタンプ、その下にメッセージ本文が表示されます。画像はライブプレビューのcanvas上で即座に生成され、ワンクリックでダウンロードできます——待ち時間もアップロードも不要です。
カスタマイズできる項目
- ヘッダーに表示するサーバー名とチャンネル名。
- ダークまたはライトテーマ——ダークがDiscordの本来のデフォルトです。
- 無制限のメッセージ行——それぞれに独自のユーザー名、ロールカラー、タイムスタンプを設定可能。
- Discordのメッセージ幅に合わせて自動的に折り返されるメッセージ本文。
責任ある利用について
このジェネレーターは、ユーモアやストーリーテリング、ボットのデモ、デザイン作業のために、明確にフィクションであるDiscord風のスクリーンショットを手軽に作成できるようにすることを目的としています。証拠を捏造したり、嫌がらせを仕組んだり、偽の会話が実在のサーバーで実際に行われたと誤解させたりするためのツールではありません。このツールで作成した画像を共有する際は、「フィクション」や「モックアップ」といった注記を添えることを検討してください。
よくある活用シーン
| 用途 | 作り方のポイント |
|---|---|
| Botの通知デザイン確認 | Bot用ユーザー名に「BOT」を含め、他メンバーと違う色を選ぶ |
| モデレーション例の説明資料 | 警告メッセージをモデレーター役の色付きユーザー名で作成 |
| ミーム・ネタ画像 | 架空のサーバー名・チャンネル名で誰が見ても創作とわかるようにする |
| UIプロトタイプ | ライト/ダーク両方のテーマで見た目を比較する |
よくある質問
このツールを使うのは合法または倫理的ですか？
ツール自体は、エンターテインメント、モックアップ、プレゼンテーション、デザイン作業のために使う分には合法です。合法でも倫理的でもないのは、生成した画像を使って誰かをだますこと——例えば実際のDiscord会話であるかのように見せかけて詐欺を働いたり、誰かを嫌がらせ・誹謗中傷したり、実在のサーバーやユーザーになりすましたりすることです。居住地域によっては、こうした悪用は詐欺・名誉毀損・ハラスメントに該当する可能性があります。明確にフィクションまたは説明目的の用途にのみ使用してください。
ツールは私のメッセージをどこかにアップロードしますか？
いいえ。入力したすべてのメッセージ、ユーザー名、色、設定はブラウザのメモリ内に留まり、JavaScriptによって直接canvas要素に描画されます。PNGファイルはお使いの端末上で生成・ダウンロードされ、サーバーに送信されることは一切ありません。
1つの会話に複数の異なるユーザーを表示できますか？
はい。各メッセージ行には独自のユーザー名とロールカラーのピッカーがあるため、複数の異なるメンバー、モデレーター、ボットがそれぞれ自分の色付き名前を表示する、リアルなDiscordチャンネルをシミュレートできます。
Discordのダークテーマとライトテーマを切り替えられますか？
はい。テーマ切り替えボタンで、Discordのデフォルトのダークテーマとライトテーマを切り替えられます。プレビューはすぐに更新されます。最も本物らしく見覚えのある見た目にしたい場合はダークモードのままにしてください。大多数のDiscordユーザーが実際に見ているのはこの見た目だからです。モックアップを印刷したり、明るい背景のプレゼンスライドに埋め込んだりする場合は、視認性のためにライトモードに切り替えてください。
本物のDiscordの吹き出しのように見えますか？
いいえ——これは意図的なものです。DiscordはWhatsAppやTelegramのような吹き出しを使いません。実際のDiscordメッセージはフラットなリストとして表示されます：左側にアバター、1行にユーザー名とタイムスタンプ、その下にメッセージ本文。このツールは本物らしい見た目のために、まさにこのレイアウトを再現しています。
ロールカラーは実際のDiscordのロール一覧と連動していますか？
いいえ、連動していません。各ユーザー名の色はカラーピッカーで任意に選ぶだけの見た目上の設定で、実際のサーバーのロール設定を読み込んだり参照したりすることはありません。モデレーター役を目立たせたい、特定のBotだけ違う色にしたいといった演出目的で自由に選んでください。
ボットのメッセージらしく見せることはできますか？
はい。ユーザー名に「〇〇 BOT」のように入力し、他のメンバーと違う色を選ぶことで、Botらしい見た目を演出できます。ただし本物のDiscordが自動で付与する「BOT」バッジそのものは再現されないため、必要であればユーザー名の文字列にBOTという表記を含めるのがおすすめです。
サーバー名やチャンネル名を空欄のままにできますか？
空欄のままにもできますが、ヘッダーに何も表示されなくなるため、雰囲気を出したい場合は架空のサーバー名・チャンネル名を入れておくことをおすすめします。実在するサーバー名を使うと、本物の会話だと誤解されるリスクがあるため、明らかに架空とわかる名前を使うのが安全です。