Markdown プレビュー
左側に書くと右側でリアルタイムに表示されます。README や説明ドキュメントを書くのに十分です。
marked を使ってローカルでレンダリングします。画像やリンクはクリックで移動しますが、解析スクリプトは一切読み込みません。HTML を他のシステムに貼り付ける際は、スタイルをもう一度ご自身でフィルタリングしてください。
使う場面
- チケットや README、CMS に Markdown を貼る前に、表・フェンス付きコード・タスクリストが実際にどう描画されるか確認したいとき。
- Markdown から HTML 断片を作って静的ページやメールテンプレートに貼りたいとき。ソースではなく描画後の HTML をコピーできます。
使わないほうがよい場面
- GitHub と完全に同じ出力（見出しのアンカー、脚注、数式、Mermaid）が必要なとき。ここは marked の GFM モードで、これらの拡張は入っていません。
- Markdown の出どころが信頼できないとき。生の HTML はフィルタされず、そのままプレビュー面に描画されます。
描画はブラウザ内で完結し、Markdown は送信されません。marked は CDN ではなくこのサイトの /assets/marked.min.js から読み込みます。制限：Markdown→HTML の変換のみで、サニタイズも構文チェックも行いません。脚注・数式・Mermaid は非対応。画像は書いた URL をブラウザが直接取得するため、そのホストへリクエストが飛びます。
よくある質問
ここでは 1 回の改行で行が変わるのに、GitHub では変わらないのはなぜ？
プレビューは marked の breaks:true を有効にしているため、段落内の改行がすべて <br> になります。GitHub と素の CommonMark は、行末の半角スペース 2 つか空行があるときだけ改行します。コピーした HTML には <br> が残るので、CommonMark で描画する環境では段落の間隔が原稿と変わります。
コピーした HTML はそのまま自分のページに貼れますか？
中身はプレビュー領域の innerHTML で、h1・p・ul・table・pre/code・br などのタグだけです。このサイトの CSS も html/head も含まれないため、スタイルは自分で当ててください。marked はサニタイズしないので、Markdown 内の生 HTML（script タグや onerror 属性）もそのまま出ます。innerHTML 経由で挿入した script は実行されませんが、イベント属性や外部画像は効くことがあるため、信頼できる内容だけを貼ってください。
表とタスクリストはどう書けば描画されますか？
どちらも GFM 記法です。表は 2 行目に |---|---| のような区切り行が必要で、列数はヘッダーと揃えてください。タスクリストは - [ ] または - [x]（括弧内の半角スペースが必要）と書くと disabled のチェックボックスになります。フェンス付きコードは pre と code（language-js のような class 付き）になり、シンタックスハイライトは行いません。