MarkdownからHTMLへの変換
ライブプレビュー付きでMarkdownをHTMLに変換します。コンテンツを貼り付けると、整形された結果がすぐに表示されます。
マークダウン入力
HTML出力はここに表示されます…
PixConvert Markdownコンバーターを使う理由
ライブプレビューとクリーンなHTML出力 ― ウェブ上で最速のMarkdownツール。
ライブプレビュー
入力するたびにレンダリングされたHTMLプレビューが更新されます。Markdownがどのように表示されるかを正確に確認できます。
クリーンなHTML出力
marked.js v18 を搭載 — CommonMark Markdown からセマンティックで仕様に準拠した HTML を生成します。
GitHubスタイルの休憩
GFM（GitHub Flavored Markdown）の改行を切り替えて、単一改行でレンダリングします。
XSS対策
出力サニタイズオプションは、安全なHTML埋め込みのためにスクリプトタグとイベントハンドラを削除します。
HTMLソースビュー
HTMLソースタブに切り替えて、生のマークアップをコピーをし、CMSまたはコードベースに直接貼り付けてください。
100%プライベート
レンダリングはすべてブラウザ内で行われます。Markdownコンテンツがデバイスから外部に送信されることはありません。
マークダウン変換のユースケース
Markdownは世界共通の文章作成フォーマットであり、このツールはそれをウェブに接続します。
ブログとCMSの公開
Markdown形式の投稿をHTMLに変換し、生のHTMLを受け入れるCMSプラットフォームで使用できるようにしました。
- WordPress HTMLエディター用に変換
- Notionのエクスポートを準備する
- ウェブサイト向けのREADMEコンテンツのフォーマット
メールテンプレート
Markdownでメールを作成し、HTMLメールクライアント向けにHTML形式に変換。
- プレーンなマークダウンで記述してください
- メールのHTML形式に変換する
- 送信前にプレビューする
文書
Markdownドキュメントをプレビューし、HTMLとしてエクスポートして、共有したりアプリに埋め込んだりできます。
- READMEファイルをプレビューする
- ドキュメントをHTMLページとしてエクスポートする
- アプリ内ヘルプシステムに組み込む
MarkdownをHTMLに変換する方法
左側のエディタにMarkdownテキストを貼り付けてください。右側のHTMLプレビューはリアルタイムで更新されます。
HTMLソースタブに切り替えると、生のHTMLが表示されます。「HTMLをコピー」をクリックすると、クリップボードに保存されます。
CMS、ブログ、または静的サイトジェネレータに貼り付ける前に、ライブプレビューを使用して書式を確認してください。
その他のツールを見る
このツールと併用すると非常に便利な他の無料ツールも見つけてみましょう。
よくある質問
MarkdownからHTMLへの変換について解説します。
どのMarkdown形式がサポートされていますか？
marked.js を介して GFM (GitHub Flavored Markdown) 拡張機能を追加した CommonMark。これには、フェンス付きコードブロック、表、タスクリスト、取り消し線、自動リンクなどが含まれます。
出力されたHTMLはそのまま使用しても安全ですか？
サニタイズを有効にすると、スクリプトタグや危険な属性（onclick、onerrorなど）が削除されます。本番環境では、クライアント側のサニタイズだけに頼るのではなく、サーバーサイドライブラリ（DOMPurify、bleachなど）を使用してHTMLをサニタイズすることを常に推奨します。
テーブルをサポートしていますか？
はい。GFMスタイルのテーブル（|区切り文字を使用）はサポートされており、HTMLとしてレンダリングされます。<table>要素。アライメントコロン（:---:、---:）は尊重されます。
HTMLをMarkdownに変換はできますか？
このバージョンでは対応していません。HTMLからMarkdownへの変換（turndown）機能は今後実装予定です。今のところ、テキスト操作にはDiff CheckerまたはJSON Formatterをご利用ください。
なぜ私のコードブロックはプレーンテキストとして表示されるのですか？
コードブロックは、CommonMarkの仕様に従って、フェンス構文（```または~~~）または4スペースのインデントが必要です。インラインコードには、単一のバッククォートを使用します。プレビューでの構文ハイライトはブラウザのデフォルト設定を使用します。完全な構文ハイライト機能（Prism、highlight.jsなど）は、HTML出力を使用して独自のページに追加できます。