Markdownテーブルジェネレーター

スプレッドシート風のエディターでMarkdownテーブルを視覚的に構築します。

データはデバイスを離れません
3 × 3

各列ヘッダーの下のL / C / Rをクリックして、配置(左、中央、右)を設定します。

Markdown出力

Markdownテーブルについて

Markdownテーブルは、パイプ(|)とダッシュ(-)を使用して、プレーンテキストで構造化された表形式データを作成します。GitHub、GitLab、Reddit、ほとんどのMarkdownレンダラーでサポートされています。配置行は、各列の左、中央、右の配置を示すためにコロンを使用します。

Markdownテーブルを手動で書くのは退屈でエラーが発生しやすい可能性があります。このビジュアルエディターを使うと、スプレッドシート風のグリッドにデータを入力でき、リアルタイムで適切にフォーマットされたMarkdownを生成します。すべての処理はブラウザ内で行われます。

パイプテーブル構文、機械的に

GFMテーブルは3つの部分で構成されています: パイプ(|)で区切られたセルを持つヘッダー行、各列にダッシュ(---)を使用するすぐ下の区切り行、および同じパイプ区切り構造を持つ0以上のデータ行です。各行の先頭と末尾のパイプはオプションですが、慣例的に読みやすさのために含まれます。列の配置は区切り行のコロンで指定されます: 左揃え(デフォルト)には:---、中央揃えには:---:、右揃えには---:。最小限実行可能なテーブルはソースで次のようになります: 1行目に| ヘッダー | ヘッダー |、2行目に| --- | --- |、3行目以降に| セル | セル |。セル内容には任意のインラインMarkdownフォーマット(太字、斜体、リンク、コードスパン、画像)を含めることができますが、ブロックレベル要素(リスト、コードブロック、引用ブロック)を含めることはできません。セル内の改行は、リテラル改行ではなく<br>タグとしてエンコードする必要があります。リテラル改行はテーブル構造を壊すからです。セル内容内のパイプ文字は\|としてエスケープする必要があります。そうでなければパーサーはそれらを列区切りとして扱い、行の列数が間違ってしまいます。ほとんどのパーサーは列幅の不整合を許容します。ソース| a | b |と| aaa | b |は同じようにレンダリングされます。後者の方がソースで「正しく」見えるとしても。このツールは常に読みやすさのために整列幅のソースを出力しますが、コンパクトソースと同じようにレンダリングされます。

テーブルがレンダリングされる場所とそうでない場所

正しくレンダリングされる: GitHub(issue、プルリクエスト、README、wikiページ、ディスカッション、コードレビュー、どこでもコメント)、GitLab(同じサーフェス)、Bitbucket、Stack Overflow、Reddit(GFMがsubredditで有効な場合、ほとんどそうです)、Discord(コードブロックコンテキストのみ、完全なGFMテーブルはチャットメッセージではレンダリングされませんがmarkdown-itはドキュメントサーフェスで処理します)、Notion(独自のテーブルインポート付き)、Obsidian、Logseq、Bear、ほとんどの静的サイトジェネレーター(Hugo、Jekyll、Eleventy、remark-gfmプラグイン付きAstro、Next.js MDX)、VS Codeのプレビュー、GitHub Pages、Read the Docs(構成による)。正しくレンダリングされない: 厳密なCommonMark(commonmarkリーダーで拡張なしのPandoc、pipe-tableフラグなしのDiscount Cパーサー)、Slack(Markdownのサブセットをレンダリングしますがテーブルはしません)、ほとんどのメールクライアント(メール内のレンダリングされたHTMLは構造的には問題ありませんがインラインスタイルで、Markdownではありません)、Markdownプラグインなしの古いWordPressインストール。一般的なルール: 宛先が開発者向けプラットフォーム(GitHubファミリー、技術ドキュメント)であれば、GFMテーブルは動作します。宛先が一般読者向けプラットフォーム(Slack、メール、Twitter)であれば、テーブルはレンダリングされないと想定し、画像に事前レンダリングするかリストとして書き直してください。

代替Markdownテーブル構文

パイプテーブル形式はGitHubの普及によって支配的ですが、唯一のMarkdownテーブル構文ではありません。Pandocシンプルテーブルはパイプではなく空白行とダッシュの区切り文字を使用し、視覚的な位置で列を整列します。狭いテーブルにはずっと読みやすいですが、手で書くのは難しいです。Pandoc複数行テーブルは複数行にまたがるセルをサポートします。1行に収まらない長い説明コンテンツに重要です。PandocグリッドテーブルはASCIIアートの境界(+---+---+)を使用します。手で維持するのは苦痛に見えますが、ツールが出力するのは簡単です。reStructuredText(Sphinx)はグリッドテーブルを排他的に使用します。すべてのPythonプロジェクトのドキュメントはこの方法で書かれています。AsciiDocは技術書執筆のために最適化された異なるパイププレフィックス構文(|===)を使用します。Markdown内のHTMLは常にエスケープハッチとして利用可能です: どんなMarkdownプロセッサーも生のHTMLを通過させるので、パイプテーブルでは不十分な場合は完全な行/列スパン、セマンティックマークアップ、CSSスタイリングを持つ本物の<table>を入れることができます。このツールが生成するパイプテーブル構文はGFMスタイルで、モダンな開発者エコシステムにとって最も互換性のある選択肢です。

一般的な用途

幅の問題とその他の制約

パイプテーブルには知っておくべきいくつかの固有の制限があります。列幅は最長のセルコンテンツによって制約されます。一つのセルの長いURLや説明的な段落は列全体を広くし、標準的なドキュメントページ幅に収まらない扱いにくいテーブルを生成する可能性があります。修正は、長いコンテンツを切り詰める(詳細は他所にリンク)か、折り返し可能なセルが必要な場合はHTMLインラインを使用することです。行または列のスパンなし、各セルは正確に1行と1列を占めます。マージされたセルを持つ複雑なテーブルは、rowspan / colspan属性を持つ本物のHTML <table>が必要です。ネストされたテーブルなし、Markdownでテーブルを別のテーブルセル内に入れることはできません。セル内のブロックレベルコンテンツなし、セル内にリストなし、コードブロックなし、引用ブロックなし。インラインコンテンツ(太字、斜体、コードスパン、リンク、画像)は問題ありませんが、複数行のものには<br>タグが必要です。ヘッダー行はGFMで必須、ヘッダーなしのテーブル構文はありません。表示ヘッダーなしのテーブルが欲しい場合は、ヘッダーセルを空白にしますが、行はまだ存在する必要があります。配置は列ごとに列全体に適用されます、同じ列の異なるセルに異なる配置を持つことはできません。これらの制約を超える洗練されたテーブルレイアウトには、正しいツールはMarkdown自体ではなく、Markdownソース内のHTMLです。

CSV ↔ Markdown変換

ほとんどの実世界の表形式データはCSVファイル(スプレッドシートエクスポート、APIレスポンス、ログ分析出力)にあります。Markdownとの間で変換することは一般的なワークフローです。CSV → Markdown: CSVをパース(埋め込みカンマを持つクォートされたフィールド、エスケープされたクォート、フィールド内の改行を処理)し、適切なヘッダーと区切り行で各行を| 値 | 値 |としてフォーマットします。これを含むほとんどのテーブルジェネレーターはCSVインポートを提供します。1回限りの変換には、csvkitのcsvlookコマンドラインツールも使用できます。これは同様のパイプ形式の出力を生成します。Markdown → CSV: GFMテーブルを行と列にパースし直し、適切なクォートでCSVを出力します。分析のために構造化データをドキュメントからスプレッドシート形式に戻す抽出に便利です。Markdown-to-CSV方向は、pandoc(適切なリーダー/ライターの組み合わせで)、tableconvert.com、およびさまざまなコマンドラインユーティリティのようなツールによって提供されます。ラウンドトリップは一方向で損失があります。フォーマット(太字、リンク、画像)は、CSVセルコンテンツを生のMarkdownテキストとして書き、結果を再びMarkdownとして扱う場合にのみCSVステップを無傷で生き残ります。

プライバシー: なぜここでもブラウザのみが重要なのか

テーブルは機密データのように見えませんが、テーブルの内容はしばしばそうです。プロジェクト計画には人事決定と未発表の機能が含まれます。価格テーブルには商業情報が含まれます。未公開のブログ投稿の比較テーブルは編集ポジショニングを明らかにします。会議ノートのアクションアイテムには割り当てと説明責任情報が含まれます。サーバーサイドのテーブルジェネレーターはあなたのデータをサードパーティにアップロードし、そこでログに残ります。このツールはJavaScriptを介してブラウザで完全に実行されます。セルを編集する間にDevToolsのネットワークタブで検証するか、ロード後にページをオフラインに(機内モードに)してもエディタはまだ機能します。未公開のドキュメントドラフト、内部プロジェクト計画、まだ公開されていないブログ投稿の比較テーブル、または見知らぬ人のハードドライブにコピーされたくないテーブルコンテンツに対して安全です。

よくある質問

どのMarkdownテーブル構文が生成されますか?

パイプ、ダッシュ区切り行、配置用のオプションのコロンを持つ標準のGFM(GitHub Flavored Markdown)構文を生成します。この構文は、GitHub、GitLab、Reddit、Jekyll、Hugo、ほとんどのMarkdownプロセッサで動作します。

列の配置を設定するには?

各列ヘッダーの下のL(左)、C(中央)、R(右)ボタンをクリックします。左揃えは:---、中央は:---:、右は区切り行で---:を使用します。

CSVからインポートしたり、スプレッドシートから貼り付けたりできますか?

CSVインポートはロードマップにあります。今のところ、Excel/Google Sheetsからの貼り付けはほとんどの場合機能します。ほとんどのスプレッドシートアプリはタブ区切りデータをクリップボードに置くため、個々のセルに貼り付けることができます。手動貼り付けなしの一括CSVインポートには、csvkitのcsvlookのようなコマンドラインツールは類似のGFMテーブル出力を生成するか、pandocはpandoc --from csv --to gfm input.csvでCSVをMarkdownに直接変換できます。

マージされたセル、ネストされたテーブル、またはセル内のブロックコンテンツについてはどうですか?

GFMパイプテーブルはこれらをサポートしません。各セルは正確に1行と1列を占めます; rowspanやcolspanはありません。ネストされたテーブルはありません。セル内のブロックレベルコンテンツ(リスト、コードブロック、引用ブロック)はありません、インラインコンテンツ(太字、斜体、コードスパン、リンク、画像、<br>を介した改行)のみです。これらの制約を超える洗練されたテーブルレイアウトには、生のHTML <table>をMarkdownソースに直接埋め込みます。すべてのMarkdownプロセッサーはHTMLを変更せずに通過させます。トレードオフは、ソースが手で読み書きするのがずっと難しくなることです。

行や列の制限はありますか?

最大20列と100行を持つことができます。ほとんどのドキュメントとREADMEファイルにとっては十分すぎるほどです。テーブルは入力するにつれてリアルタイムで更新されます。

私のテーブルの内容はどこかに送信されますか?

いいえ。生成はJavaScriptを介してブラウザで完全に実行されます。編集するセルとMarkdown出力は決してネットワークを越えません。入力する間にDevToolsのネットワークタブで検証するか、ロード後にページをオフラインに(機内モードに)してもエディタはまだ機能します。未公開のドキュメントドラフト、内部プロジェクト計画、まだ公開されていない価格比較テーブル、または見知らぬ人のハードドライブにコピーされたくない表形式コンテンツに対して安全です。

関連ツール

Markdownプレビュー

Markdownを書いてレンダリングをプレビューします。

Markdown → HTML

MarkdownをクリーンなHTMLコードに変換します。

HTMLテーブルジェネレーター

HTMLテーブルを視覚的に構築してコードをコピーします。