Markdownフォーマッター：オンラインでMarkdownのフォーマット、プレビュー、整形
Markdownは開発者ドキュメンテーションの共通言語です——すべてのREADME、GitHub Issue、Stack Overflowの回答、静的サイトのブログ記事がMarkdownで書かれています。John Gruberが2004年にMarkdownを作成した目的はシンプルでした：そのまま読めるが、構造的に有効なHTMLに変換できるプレーンテキスト形式。20年後、Markdownは異なる拡張を持つ複数のフレーバー（CommonMark、GitHub Flavored Markdown、MDX、R Markdown）に分裂し、ネストされたリスト、リスト内のコードブロック、テーブルを含む複雑なMarkdownを書くことは驚くほど繊細です。当Markdownフォーマッターはこれを解決します：左側に生のMarkdown、右側にライブレンダリングされたプレビューを持つ分割ペインエディタ。フォーマッターはMarkdownを一貫したフォーマットに正規化します——見出しスタイル、リストのインデント、コードフェンスマーカー、リンク参照定義を標準化します。CommonMark仕様（元のMarkdown構文の曖昧さを解決した正式な標準）に加えて、GitHub Flavored Markdown拡張（テーブル、タスクリスト、打ち消し線、自動リンク、脚注）をサポートしています。また、コードフェンスに埋め込まれたMermaidダイアグラム（フローチャート、シーケンス図、クラス図、ガントチャート）もレンダリングし、ドキュメントをリッチでビジュアルなコンテンツに変えます。静的サイトジェネレーター（Jekyll、Hugo、MDXを使用したNext.js、Astro、Docusaurus）のユーザー向けに、フォーマッターはフロントマター（YAML/TOML）検証を含み、フォーマット中もそれを変更せずに保持します。
Markdownエディター
無料 · 登録不要
ステップバイステップガイド
エディタでMarkdownを作成または貼り付け
左ペインは、見出し、太字、斜体、リンク、コード、リストのシンタックスハイライトを備えたフル機能のMarkdownエディタです。README、GitHub Issue、CMSエクスポートから既存のMarkdownを貼り付けます——フォーマッターはMarkdownフレーバーを自動検出し、拡張を保持します。エディタには、正確な構文を覚えたくない場合に一般的な要素（テーブル、画像、リンク、コードブロック）を挿入するためのツールバーが含まれています。
リアルタイムでプレビューとフォーマット
右ペインは入力に応じてライブプレビューをレンダリングします——最後のキーストロークから50ミリ秒以内にプレビューが更新されます。プレビューを使用して、フォーマットを視覚的に確認し、リンク先をチェックし、コードブロックにシンタックスハイライト用の正しい言語タグがあることを確認します。「フォーマット」をクリックして生のMarkdownを標準化します：見出しスタイルの正規化、一貫性のないリストインデントの修正、テーブル列の整列、可能な場合はインラインHTMLのMarkdownへの変換。
コピー、ダウンロード、またはHTMLにエクスポート
フォーマットされたMarkdownをコピーするか、.mdファイルとしてダウンロードするか、レンダリングされた出力を埋め込みCSS付きのスタンドアロンHTMLファイルとしてエクスポートします（GitHubのレンダリングスタイルに一致）。HTMLエクスポートには、CMSやメールに貼り付ける準備ができた完全なレンダリングドキュメントが含まれます。静的サイトのセットアップでは、フロントマターを保持したMDX互換Markdownとしてエクスポートします。
ヒントとベストプラクティス
CommonMark（2014年）は、15年以上の曖昧さを解決した正式なMarkdown仕様です。主な明確化：リストの前には空白行が必要；インデントされたコードブロックは4スペース（4文字ではなく）；setext見出し（===または---で下線を引く）は前に空白行が必要；バックスラッシュでエスケープされた改行はハードブレークです。すべての主要なMarkdownプロセッサ（GitHub、Reddit、Stack Overflow、Discord）はCommonMarkに準拠しています。
GitHub Flavored Markdown（GFM）はCommonMarkを以下で拡張します：（1）テーブル——パイプとハイフンで作成、オプションのコロン配置付き；（2）タスクリスト—— - [ ]（未チェック）と - [x]（チェック済み）を使用したチェックボックス；（3）打ち消し線——~~ダブルチルダ~~を使用；（4）自動リンク——生のURLが自動的に山括弧なしでクリック可能なリンクに変換されます；（5）脚注——[^1]構文を使用した参照スタイルのノート；（6）危険なタグと属性をセキュリティのために削除する「許可されない生のHTML」フィルター。
コードブロックには、シンタックスハイライトのために常に言語識別子を含める必要があります：```javascript、```python、```bash、```yaml。言語タグがないと、コードはハイライトなしでレンダリングされ、読みにくくなります。ほとんどのシンタックスハイライター（Prism、highlight.js、Shiki）で200以上の言語がサポートされています。トリプルバックティックフェンス（```）は、言語タグをサポートし視覚的により明確なため、インデントされたコードブロックよりも推奨されます。
Markdownのテーブルはパイプとハイフンで定義されます。ヘッダー行はハイフンの行でボディから区切られ、オプションのコロンで配置を指定します：左（:---）、中央（:---:）、右（---:）。セルの内容にはインラインMarkdown（太字、斜体、リンク、コード）を含めることができますが、ブロック要素（見出し、コードブロック、リスト）は含められません。複雑なテーブルには、ほとんどのMarkdownフレーバーで有効なHTML <table>要素の使用を検討してください。
README.mdファイルには、標準的な構造に従ってください：（1）プロジェクトタイトルと1行の説明；（2）バッジ（ビルドステータス、npmバージョン、ライセンス）；（3）目次（doctocやmarkdown-tocなどのツールで自動生成）；（4）インストール（コピー＆ペースト可能なコマンド）；（5）使用方法（現実的なシナリオのコード例）；（6）APIリファレンス；（7）コントリビューションガイドリンク；（8）ライセンス。GitHubの2023年オープンソース調査によると、よく構造化されたREADMEはプロジェクトの採用を40%増加させます。
Markdownコードフェンス内のMermaidダイアグラムを使用すると、フローチャート、シーケンス図、クラス図、状態図、ガントチャート、円グラフ、Gitグラフをドキュメント内で直接作成できます——外部の描画ツールから画像をエクスポートする必要はありません。```mermaidを言語タグとして使用します。当フォーマッターはプレビューペインでMermaidダイアグラムをライブレンダリングし、抽象的なダイアグラム定義を視覚的な出力に変えます。
静的サイトジェネレーター（Jekyll、Hugo、Next.js、Astro、Docusaurus）用のMarkdownを書く場合、ファイルはフロントマター——タイトル、日付、タグ、スラッグなどのメタデータを含む---区切り文字間のYAML（または+++区切り文字間のTOML）——で始まります。当フォーマッターはフロントマターが整形式のYAML/TOMLであることを検証し、フォーマット中も変更せずに保持し、必須フィールド（SSGによって異なる）が欠落している場合に警告します。
Markdownのリンク参照スタイル——URLをインラインテキストとは別に定義する——は、長いドキュメントの可読性を向上させます：本文では`[link text][ref]`、下部では`[ref]: https://example.com`。フォーマッターはワンクリックでインラインリンクを参照スタイルに（またはその逆に）変換し、参照定義を出現順に自動的に再番号付けします。
よくある質問
Markdownはプレーンテキストを美しく構造化されたドキュメントに変えます——ただし、正しくフォーマットされている場合に限ります。当ライブプレビューエディタは、Markdownがどのようにレンダリングされるかを正確に表示し、フォーマッターは構文をクリーンで一貫性のある状態に保ちます。今すぐMarkdownを作成、プレビュー、フォーマットしてください——サインアップ不要、すべてブラウザ内で。
このツールを無料で試す →open_in_new