Markdownエディター

リアルタイムプレビュー付きMarkdownエディター。

Markdownをリアルタイムで書いてプレビューする

概要

MarkdownはREADME、GitHubのIssue、ドキュメント、静的サイトのブログ記事、Obsidian・Notionなどのノートアプリの基盤となる軽量マークアップ言語です。#で見出し、**で太字、-でリストといった簡単な記号で平文を書くと、整ったHTMLにレンダリングされます。このスタジオは分割画面エディターを提供します — 左にMarkdown、右にライブのレンダリングプレビュー。入力するそばから見た目を正確に確認できます。すべてブラウザ内で動き、テキストはアップロードされません。

使い方(ステップ)

  1. 1

    左にMarkdownを入力

    #、**太字**、- リスト、``` コードフェンス、| 表 |、[リンク](url)を書くとプレビューが即時にレンダリングされます。

  2. 2

    ライブプレビューを確認

    右枠にMarkdownレンダラーで表示される通りの書式結果が出ます。

  3. 3

    書き出しまたはコピー

    .mdファイルで保存するか、レンダリングしたHTMLをコピーしてブログ・メール・CMSに貼り付けます。

仕組み

入力するたびにMarkdownパーサーがソースをHTMLへ変換し、プレビュー枠にレンダリングします。見出し、太字・斜体、リンク、画像、順序付き・順序なしリスト、引用、シンタックスハイライト付きコードブロック、表、タスクリストなど一般的なCommonMark/GitHub Flavored Markdownの機能をサポートします。結果は.mdファイルとして書き出すか、レンダリングしたHTMLをコピーできます。ドキュメントはローカル保存され、再読み込みでも作業が失われません。

こんなときに使う

即時の視覚フィードバックでGitHub README・プロジェクト文書を書くとき。静的サイト(Hugo・Jekyll・Astro・Next.js)のブログ記事執筆。書式付きノート・議事録・技術仕様の準備。平文ノートをメール・CMS用の整ったHTMLへ変換。ライブ結果を見ながらMarkdown文法を学ぶとき。後でMarkdown対応プラットフォームに貼る内容をオフラインで作成。

よくある質問

見出し・強調・リスト・リンク・画像・コードブロック・引用・表・タスクリストなど一般的なCommonMarkとGitHub Flavored Markdownの機能です。プラットフォーム固有の拡張は対象サイトで異なって表示されることがあります。

Markdownエディター | Super Easy Utils