📝 Markdownプレビュー

左にMarkdownを入力すると、右(スマホでは下)にHTMLプレビューをリアルタイム表示します。

プレビュー

※ 入力テキストは先にすべてエスケープしてから安全にHTML化しているため、<script>などのHTMLタグはそのまま文字として表示され、実行されません。処理はすべてブラウザ内で完結し、入力内容が送信されることはありません。

解説

Markdown(マークダウン)は、記号を使って手早く文章の構造を表す軽量記法です。HTMLタグを書かなくても、「# 見出し」「**太字**」「- 箇条書き」のように打つだけで、見出し・リスト・リンク・表などを表現できます。GitHub、各種ブログ、ドキュメントツール、チャットなど多くのサービスが採用しており、覚えておくと文章作成が速くなります。本ツールは、書いたMarkdownがどんな見た目になるかをその場で確認できるプレビューアです。

入力したMarkdownはその場でHTMLに変換され、リアルタイムでプレビューに反映されます。対応している記法は、見出し(# から ###### までの6段階)、太字(**語** または __語__)、斜体(*語* または _語_)、取り消し線(~~語~~)、インラインコード(`コード`)、コードブロック(``` で囲む)、箇条書き(- * +)、番号リスト(1. 2. …)、引用(行頭の >)、水平線(--- など)、リンク([表示文字](URL))、画像(![代替文字](URL))、テーブル(| で区切り、2行目に | --- | の区切り行)です。生成されたHTMLソースはボタンでコピーできます。

具体例として、入力欄に `## 買い物リスト` と書いて改行し、`- りんご` `- バナナ` と続けると、プレビューには「買い物リスト」という小見出しと、その下に2項目の箇条書きが表示されます。`[シルギア](https://shirugear.com)` と書けば、クリックできるリンクになります。

安全性を最優先に設計しています。本ツールは入力テキストをまず全文HTMLエスケープ(& < > " ' を実体参照化)してから、見出しや太字など限られた安全なタグだけを組み立てて表示します。そのため、入力に含まれる `<script>` などの生のHTMLタグは実行されず、文字としてそのまま表示されます(XSS対策)。リンクや画像のURLも検査され、javascript: のような危険なスキームは無効化されます。生HTMLの埋め込みには対応していません。

脚注、定義リスト、タスクリスト(- [ ])、数式(LaTeX)、ネストの深い入れ子リストなど一部の拡張記法には対応していません。一般的な文書・記事で使う基本記法に絞っています。表の各行はヘッダー行の列数に合わせて表示され、足りないセルは空欄になります。

処理はすべてお使いのブラウザ内のJavaScriptで完結し、入力したMarkdownがサーバーや外部に送信されることはありません。ネットワーク通信も発生しないため、下書きや社内文書など外に出したくないテキストの整形・プレビューにも安心して使えます。

よくある質問

Markdownの基本的な書き方を教えてください。

見出しは行頭に「# 」(#の数で大きさが変わる)、太字は **語**、斜体は *語*、箇条書きは行頭に「- 」、番号付きは「1. 」、リンクは [表示文字](URL)、引用は行頭の「> 」と書きます。コードはバッククォート ` で囲みます。このツールに打ち込めば、変換結果を見ながら覚えられます。

表(テーブル)はどう書きますか?

1行目にヘッダーを | 項目 | 値 | のように書き、2行目に区切り線 | --- | --- | を置きます。3行目以降にデータ行を | りんご | 100円 | のように並べます。区切り線で : を使うと寄せ(左/中央/右)の指定にもなります。

入力したMarkdownは外部に送られますか?

送られません。変換はすべてお使いのブラウザ内のJavaScriptで行われ、ネットワーク通信は一切発生しません。社内文書や下書きにも安心して使えます。

HTMLタグを直接書いて表示できますか?

いいえ。安全のため(XSS対策)、入力に含まれるHTMLタグは実行されず、そのまま文字として表示されます。生のHTML埋め込みには対応していません。

変換したHTMLはどう使えますか?

「HTMLをコピー」ボタンで生成されたHTMLソースをコピーできます。ブログCMSのHTML編集欄やメールテンプレート、自作サイトなどに貼り付けて使えます。

対応していない記法はありますか?

脚注、定義リスト、タスクリスト、数式(LaTeX)、深いネストのリストなどには対応していません。見出し・装飾・リスト・引用・コード・リンク・画像・表といった、一般的な文書で使う基本記法に絞っています。