How to
Markdown を編集しながら、プレビュー、HTML、コードブロックの表示を同じ画面で確認できるツールです。見出しやリストを整え、テーマや表示モードを切り替え、Markdown や HTML をコピーまたはダウンロードできます。
Use Cases
Capabilities
Guide
設定、入力、プレビュー、結果、保存など、画面内のエリアごとに操作方法を説明します。
01 HOWTO
左側の入力欄で Markdown を直接編集するエリアです。見出し、段落、区切り線、引用、リスト、コード、表を入力し、プレビューへの反映を確認できます。
見出しレベルの選択で、H1 から H6 までの階層を挿入できます。
太字、強調、打ち消し線、インラインコードで、重要な語句や短いコード片を整えられます。
引用、箇条書き、番号付きリストで、説明や手順を読みやすく整理できます。
リンク、画像、コードブロック、テーブルを追加して、技術メモや手順書に必要な情報を入れられます。
02 HOWTO
入力欄の上にあるツールバーと右上の編集補助で、整形、行番号、折り返し、クリア、コピー、履歴、元に戻す、やり直すを操作するエリアです。
引用、箇条書き、番号付きリストをボタンで追加し、文章構造を整えられます。
リンク、画像、コードブロック、テーブルをボタンから挿入できます。
Markdown 履歴、戻る、進むを使って、直前の編集状態へ戻したり再適用したりできます。
見出しレベル、行番号、折り返しを調整して、長い Markdown を編集しやすくできます。
03 HOWTO
右側のプレビューで Markdown の表示結果を確認し、テーマ、分割表示、Markdown への移動、エディタへの移動、全画面表示を切り替えるエリアです。
プレビューテーマを切り替えて、共有先に近い見た目を確認できます。
分割表示、Markdown への移動、エディタへの移動で、編集と確認の表示を切り替えられます。
全画面表示で、長文やコードブロックを広い領域で確認できます。
見出し、段落、引用、リスト、コード、表の表示結果を確認できます。
04 HOWTO
HTML タブ、HTML のコピーとダウンロード、コードブロックの言語、行番号、折り返し、コードコピーを確認するエリアです。共有先に合わせた形式で取り出せます。
HTML 出力をコピーする操作と、HTML ファイルとしてダウンロードする操作を使い分けられます。
分割表示や移動ボタンで、取り出す前に入力内容と表示結果を再確認できます。
テーマを変えて、HTML やプレビューの読みやすさを再確認できます。
コードブロックの言語、行番号、折り返し、コードコピーを確認できます。
Notes
使う前に確認しておくと迷いにくいポイントを、理由つきでまとめています。
確認すること
Markdown 入力の変更は右側のプレビューへ反映されます。見出し、引用、リスト、コード、表の見え方を編集しながら確認できます。
確認すること
分割表示、Markdown への移動、エディタへの移動、全画面表示を使い分けると、編集作業と確認作業を切り替えやすくなります。
確認すること
Markdown のコピーだけでなく、HTML のコピーとダウンロード、コードブロックの言語・行番号・折り返し・コピーも使えます。
FAQ
使う前に判断しやすい質問を先に整理します。
あります。テーマを切り替えながら見え方を比較したり、長文を全画面で確認したり、Markdown とプレビューを並べて細かく調整したい時に向いています。
はい。分割表示、片側表示、全画面表示を切り替えられるため、長文やコードブロックを見やすい状態で確認できます。
Markdown 標準の構文に対応しています。ローカル画像の読み込みには対応していません。公開済み画像の URL を使用してください。
自動保存は行いません。テキストをコピーして別途保存するか、ブラウザの保存機能をご利用ください。
はい。Markdown テーブル構文に対応しています。列幅はプレビューテーマに合わせて表示します。
このページは 1 つの Markdown 入力エリアで動作します。複数ファイルの同時編集には対応していません。
次に見る使い方
関連する使い方を続けて見られるように、次に確認しやすい導線をまとめています。
