Markdown→HTML変換
使い方
入力エリアにMarkdownを貼り付けまたは入力してください。変換されたHTMLがリアルタイムで表示されます。デフォルトはインデント付きの整形版、「ミニファイ」チェックボックスをONにすると空白を除去した本番向けの最小化版が出力されます。コピーボタンで結果をそのまま貼り付け可能です。GitHub-Flavored Markdownの全機能(見出し・強調・リスト・表・引用・コードブロック・リンク)に対応しています。
Markdownとは
Markdownは2004年にJohn Gruberが考案したプレーンテキストのマークアップ記法です。「#」で見出し、「*」で強調、「-」でリストのように、簡単な記号で構造化された文書を書けます。READMEファイル、ドキュメントサイト、静的ブログ、チャットアプリ、CMSなどで広く使われています。GitHub-Flavored Markdown(GFM)は元の仕様を拡張し、表・タスクリスト・打ち消し線・言語指定付きコードブロックに対応しています。
出力フォーマット
このツールは2種類の出力形式を提供します: 2スペースインデントの整形版(読みやすく、ファイルに貼り付けて編集できる)と、タグ間の空白を除去したミニファイ版(ファイルサイズが小さく、本番配信に適する)。パーサーはGFMモードを有効にした`marked`を使用し、出力はDOMPurifyでサニタイズされるため、生成結果をそのままページに貼り付けてもインジェクションリスクはありません。
主な用途
- Markdownに非対応なCMS向けに下書きをHTMLに変換するブロガー。
- 静的サイトや社内Wikiに公開するためドキュメントをHTML化するテクニカルライター。
- メールテンプレート・ヘルプツールチップ・CMSの本文フィールド用にHTMLスニペットを生成する開発者。
- 学校課題・ポートフォリオ・ブログ移行で整形済みHTMLを作成する学生・コンテンツ制作者。
- MarkdownスニペットがHTMLでどう描画されるかをリポジトリにコミットする前に素早く確認する。
ヒント
- GFMの表はヘッダー行と、パイプとダッシュで構成される区切り行が必要です。
- フェンスドコードブロックは言語識別子(```js、```python)を指定でき、出力のCSSクラスに反映されます。
- ミニファイ版は本番配信向け(ペイロードが小さい)、整形版は手編集・可読性重視に適しています。
- Markdown内に埋め込まれたインラインHTMLはそのまま出力されますが、<script>のような危険なタグはサニタイズで削除されます。
- GFMモードではhttps://example.comのような生URLが自動でクリック可能なリンクになります。
プライバシー
すべてのMarkdownパースはブラウザ内で完結します。文書がサーバーに送信されたり保存されたりすることはありません。
よくある質問
整形版とミニファイ版の出力は何が違いますか?
整形版は2スペースインデントで読みやすく、手で編集しやすいHTMLです。ミニファイ版はタグ間の空白を除去してペイロードを小さくし、本番配信に適しています。「ミニファイ」チェックボックスで切り替えられます。
表などのGitHub-Flavored Markdown機能に対応していますか?
はい。変換にはGFMモードを有効にした`marked`パーサーを使っているため、表・タスクリスト・打ち消し線・フェンスドコードブロック・生URLの自動リンク化すべてに対応しています。
生成されたHTMLを公開ページにそのまま貼り付けても安全ですか?
はい。出力はDOMPurifyでサニタイズされるため、<script>のような危険なタグは除去されます。Markdown内に書いたインラインHTMLはそのまま出力されますが、同じサニタイザーを通ります。
個人的・未公開の文書を変換しても安全ですか?
はい。パースはすべてブラウザ内で行われ、文書がアップロード・ログ記録・保存されることはありません。機密性のある下書きも端末内にとどまります。
コードブロックに言語クラスを付けるにはどうすればよいですか?
開始フェンスの後に言語識別子(```js や ```python)を付けてください。識別子は生成されるcode要素のCSSクラスとして出力され、シンタックスハイライターがそれを対象にできます。