Markdown から HTML へのコンバーター — 入力と同時に、Markdown をすっきりとした、すぐに使える HTML に変換します。

Markdownを貼り付けたり入力したりすると、HTMLが即座に生成され、表示を確認したい場合はライブプレビューも利用できます。見出し、リスト、表、タスクリスト、コードブロックに対応しています。結果をコピーしたり、ファイルとしてダウンロードしたり、フルページとしてまとめたりすることも可能です。すべてブラウザ上で動作します。

Markdownを変換する テキストはブラウザ内に残ります
左側にマークダウンテキスト、右側に変換されたHTMLコードを表示するマークダウンからHTMLへのコンバーター

Markdown入力

オプション

HTML出力

–入力語
–Headings
–リンク
–HTMLのサイズ
ガイド

MarkdownからHTMLへの変換ガイド:シンプルに書いて、どこでも公開しよう

マークダウンとは何か、そしてそれがどのようにHTMLに変換されるのか。

わかりやすい説明

「MarkdownからHTMLへのコンバーター」とは何ですか?

Markdownは、通常の文字を使って書式付きテキストを作成するための軽量な方法です。MarkdownからHTMLへのコンバーターは、そのテキストをWebページに必要なHTMLタグに変換するため、素早く記述しても、適切な見出し、リスト、リンク、表が作成されます。

Markdownは変換する前から読みやすいため、ドキュメント、READMEファイル、メモ、ブログの下書き、あるいはツール間でやり取りされるコンテンツなどに広く利用されています。このコンバーターを使えば、入力と同時にHTMLが生成され、必要に応じてプレビューや完成したページを表示することも可能です。

これを使う一般的な理由

なぜ人々はマークダウンコンバーターを使うのか

ブログ記事やウェブコンテンツ

Markdownで下書きを作成し、整えられたHTMLをCMS、テンプレート、またはメール作成ツールに貼り付けます。

ドキュメント

READMEファイルやメモを、ヘルプページや社内サイトにそのまま掲載できるHTMLに変換します。

Markdownの学習

数文字入力すると、それらがどのようなHTMLタグを生成するのかを、並べて確認できます。

仕組み

MarkdownがHTMLに変換される仕組み

コンバーターはテキストをブロックごとに読み込みます。1~6個の「#」文字で始まる行は見出しとなり、ダッシュまたは数字で始まる行はリスト項目となり、3つ以上のダッシュが続く行は水平線となります。 3つのバッククォートで囲まれたテキストはコードブロックとなり、それ以外の部分はすべて段落として扱われます。これらのブロック内では、* や _ などの文字で強調表示ができ、角括弧の後に丸括弧が続く形式でリンクを作成できます。

マークダウンHTML
# 見出し1<h1>見出し1</h1>
**太字**と*斜体*<strong>太字</strong> および <em>斜体</em>
[text](https://example.com)<a href="https://example.com">テキスト</a>
- 項目<ul><li>商品</li></ul>
1. 手順<ol><li>step</li></ol>
`コード`<code>コード</code>
> 引用<blockquote><p>引用</p></blockquote>
~~なくなった~~<del>gone</del>

プレーンなMarkdownでは、1行分の改行はスペースとして扱われ、空白行から新しい段落が始まります。また、このコンバーターは、今日では多くの人が当然のように期待しているGitHubスタイルの追加機能(表、タスクリスト、取り消し線、自動リンクなど)にも対応しています。

ほんの数ステップで完了

MarkdownをHTMLに変換する方法

  1. 入力ボックスにMarkdownを貼り付けるか、.mdファイルを開くか、「サンプル」をクリックして例を確認してください。
  2. オプションを選択してください:完全なHTMLページ、見出しのID、改行、または生のHTML。
  3. 出力ボックスに表示されたHTMLを確認するか、「プレビュー」に切り替えて表示を確認してください。
  4. 「コピー」をクリックするか、「ダウンロード」をクリックして、HTMLをファイルとして保存してください。
より良い結果

簡単なヒント

  • 見出し、リスト、表、コードブロックの前後に1行空行を入れてください。これは、Markdownが期待通りに変換されない場合の最も一般的な対処法です。
  • バッククォートの後に言語名を指定した、フェンス付きコードブロックを使用してください。これにより、HTMLには構文ハイライトツールが利用できる言語クラスが付与されます。
  • 自分で作成していないテキストについては、「生のHTMLを許可する」の設定をオフにしておいてください。
  • プレビューではデフォルトのスタイルが適用されています。最終的なHTMLの表示は、ご自身のサイトのCSSによって決まります。
知っておくと役立つ情報

制限事項およびプライバシー

プライバシー

変換処理はブラウザ上で実行されます。Markdownのデータはアップロード、保存、記録されることはなく、プレビューおよびダウンロードされたファイルは、お使いの端末上で生成されます。

制限事項

これは、一般的なMarkdownおよびGitHubスタイルの機能を網羅したコンパクトなコンバーターです。完全なCommonMarkやGitHubエンジンではないため、脚注、絵文字コード、数式、および特殊なエッジケースは処理されません。許可した場合、生のHTMLは変更されずにそのまま通過するため、公開前に信頼できないコンテンツをサニタイズしてください。

よくある質問

MarkdownからHTMLへの変換ツールに関するよくある質問

マークダウンとは何ですか?

マークダウンとは、見出しには「#」を、太字にするには単語を「**」で囲むなど、プレーンテキストの記号を使って書式付きテキストを作成する方法です。2004年にジョン・グルーバーによって考案され、現在ではドキュメント、READMEファイル、メモ、そして多くのウェブサイトで利用されています。

このコンバーターは、Markdownのどの機能をサポートしていますか?

見出し、段落、太字、斜体、取り消し線、インラインコード、フェンス付きおよびインデント付きコードブロック、ブロック引用、番号付きリストおよびネストされたリスト、タスクリスト、配置指定のある表、リンク、参照リンク、画像、自動リンク、および水平線。

この結果は、GitHubのMarkdownと同じですか?

このライブラリは、一般的なCommonMarkのルールに準拠しつつ、GitHubスタイルの表、タスクリスト、取り消し線、自動リンクの機能を追加しています。GitHub独自のレンダラーは、絵文字コード、メンション、脚注など、さらに多くの機能を備えており、一部の特殊なケースでは表示結果が異なる場合があります。

私のテキストはどこかにアップロードされていますか?

いいえ。変換処理はブラウザ上で実行されるため、Markdownデータが端末の外に出ることはありません。

このHTMLは公開しても問題ないでしょうか?

デフォルトでは、入力したHTMLはすべてエスケープされ、「javascript:」などで始まるリンクはブロックされます。「生のHTMLを許可」を有効にすると、HTMLは変更されずにそのまま通過するため、他者から提供されたコンテンツを公開する前に、適切なHTMLサニタイザーで処理してください。

なぜ1行分の改行が無視されてしまうのですか?

Markdown では、1 行の改行はスペースと同様に扱われ、空白行のみが新しい段落の始まりとなります。強制的に改行を行うには、行の末尾にスペースを 2 つ、またはバックスラッシュを付けるか、1 行の改行を <br> タグに変換するオプションを有効にしてください。

表はどのように作成すればよいですか?

セルをパイプで区切り、見出しの下にダッシュの行を追加します。例えば、| 名前 | 価格 | や | --- | --- | といった具合です。ダッシュの左側、右側、または両側にコロンを追加することで、列を左揃え、右揃え、または中央揃えにすることができます。

断片ではなく、完全なHTMLページを取得するにはどうすればよいですか?

「フルHTMLページ」を有効にします。その結果、出力はdoctype、head、bodyで囲まれ、最上位の見出しがページタイトルとして使用されます。

見出しIDは何のためにあるのですか?

見出しにIDを付与すると、そのセクションに直接リンクできます(例:page.html#installation)。「見出しIDを追加」を有効にすると、各見出しにはそのテキストから生成された小文字のIDが割り当てられ、同じ見出しが繰り返される場合は番号が追加されます。

このツールを利用している方々から

レビュー

レビューを読み込んでいます…
頑張り続けよう

ツールボックスには他にもツールが入っています

このホームページには、APIキーを必要としない無料ツールが他にも数十種類掲載されています。

ツールを提案する