このツールについて
Markdown で文章を書いていると、見出しの階層や表の書式が意図どおりになっているか、実際に描画してみないと分かりません。このツールは左側のエディタに入力した内容を、右側で即座にレンダリングして表示します。保存やビルドを挟まずに結果を確認できるため、README や議事録の下書きがそのまま完成形に近づいていきます。
対応しているのは CommonMark に加えて GitHub Flavored Markdown（GFM）の拡張です。表、タスクリスト、打ち消し線、自動リンクといった、実際の README でよく使われる記法をそのまま確認できます。
貼り付けた Markdown はブラウザ内でのみ解析されます。HTML への変換時にはサニタイズ処理を通しているため、スクリプトを含む文書を貼り付けても安全にプレビューできます。
使い方
- 左側のエディタに Markdown を入力するか、既存の文書を貼り付けます。
- 入力と同時に右側のプレビューが更新されます。保存操作は必要ありません。
- 中央の仕切りを左右にドラッグすると、エディタとプレビューの幅を変更できます。
- 内容は自動的にブラウザへ保存されるため、ページを閉じても次回そのまま再開できます。
- 「スクロール連動」をオンにすると、エディタとプレビューのどちらをスクロールしても、もう一方が同じ位置まで自動でスクロールします。全画面ボタンで、エディタとプレビューだけを画面いっぱいに表示することもできます。
特徴
リアルタイム反映
1文字入力するたびにプレビューが更新されます。変換ボタンを押す必要はありません。
GFM 対応
表・タスクリスト・打ち消し線・自動リンクなど、GitHub で使われる記法に対応しています。
安全なプレビュー
HTML 変換時にサニタイズを行うため、スクリプトを含む文書でも安全に表示できます。
幅の調整と自動保存
ペインの幅と入力内容はブラウザに保存され、次回も同じ状態から作業を再開できます。
スクロール連動と全画面表示
エディタとプレビューのスクロールを連動させたり、全画面表示にして広い画面で執筆に集中したりできます。
よくある質問
書いた Markdown はどこに保存されますか？
お使いのブラウザの localStorage にのみ保存されます。サーバーへ送信されることはなく、他の端末とは共有されません。
表やチェックボックスは使えますか？
使えます。GitHub Flavored Markdown の表記法に対応しているため、パイプ記号による表や `- [ ]` 形式のタスクリストがそのまま描画されます。
HTML タグを直接書けますか？
基本的な装飾タグは描画されますが、安全のため script や onclick などの実行可能な要素・属性は取り除かれます。
プレビュー結果を印刷・PDF 化できますか？
ブラウザの印刷機能をお使いください。印刷時はプレビュー側の内容が読みやすい形で出力されます。
スクロール連動はどのように位置を合わせていますか？
行単位の厳密な対応ではなく、スクロール可能な範囲に対する位置の割合（先頭からの%）を基準に合わせています。文書の構成によっては多少ずれる場合があります。