Markdownプレビュー
使い方
- 入力欄にMarkdownテキストを入力または貼り付けます。
- レンダリングされたプレビューがリアルタイムで更新されます。
- プレビューの下に生成されたHTML出力を確認できます。
対応する構文
- 見出し：# H1、## H2、### H3（H6まで）
- 太字：**テキスト**、斜体：*テキスト*、太字斜体：***テキスト***
- コード：`インラインコード`、```フェンスドコードブロック```
- リンク：[テキスト](URL)、画像：
- リスト：- 項目 または 1. 項目
- 引用：> 引用文
- 水平線：--- または ***
- 打ち消し線：~~テキスト~~
Markdownとは
Markdownは、2004年にJohn Gruberによって考案された軽量マークアップ言語です。シンプルで読みやすい記法を使って、HTMLに変換できる書式付きテキストを作成できます。GitHubやGitLab、Stack Overflowをはじめとする多くのプラットフォームで標準的な記述形式として採用されています。READMEファイル、技術ドキュメント、ブログ記事、メモアプリなど幅広い場面で活用されており、HTMLを学ばなくても構造化された文書を手軽に書ける点が大きな魅力です。
活用例
- GitHubやGitLabでのソフトウェアプロジェクトのREADMEファイル。
- 技術ドキュメントやAPIリファレンスの作成。
- Jekyll、Hugo、Gatsbyなどを使ったブログ記事の執筆。
- ObsidianやNotionなどのアプリでの個人メモやナレッジベースの管理。
- 統一されたフォーマットが求められる技術文書やレポートの作成。
Markdownを書くコツ
- 見出し（# 〜 ######）を活用して、文書の構造と階層を明確にしましょう。
- 公開前にプレビューを確認し、書式の崩れを早めに発見しましょう。
- セル結合のあるテーブルや文字色の変更など、高度な書式が必要な場合はインラインHTMLと組み合わせましょう。
- コードブロックには言語名（例：```javascript）を指定すると、シンタックスハイライトが適用されます。
- 1行を短めに保ち、段落間に空行を入れると、ソースの可読性が向上します。
プライバシー
すべてのレンダリングはブラウザ内で完結します。データがサーバーに送信されることはありません。HTML出力はXSS防止のためにサニタイズされます。
よくある質問
このプレビューツールとMarkdown→HTML変換ツールの違いは何ですか？
本ツールは入力しながら見た目を確認できるライブのレンダリングプレビューに重点を置きつつ、生成されたHTMLも表示します。専用の変換ツールはミニファイなどのオプション付きで、貼り付け用のHTMLを作ることに特化しています。
対応しているMarkdown記法は何ですか？
見出し（# 〜 ######）、太字・斜体・太字斜体、インラインコードとフェンスドコードブロック、リンクと画像、順序付き・順序なしリスト、引用、水平線、打ち消し線といった一般的な要素に対応しています。
個人的なメモや未公開のドキュメントを貼り付けても安全ですか？
はい。レンダリングはすべてブラウザ内で行われ、アップロード・ログ記録・保存は一切ありません。機密性のある下書きも端末内にとどまります。
レンダリングされたHTMLは悪意のあるコンテンツに対して安全ですか？
はい。HTML出力はXSS防止のためサニタイズされるため、入力に含まれる危険な構文はレンダリング前に除去されます。自分で書いたインラインHTMLも同じサニタイザーを通ります。
コードブロックにシンタックスハイライトを付けられますか？
開始フェンスの後に言語識別子（例：```javascript）を付けると、そのコードブロックに言語が指定され、ハイライトや見やすい整形が有効になります。