Markdownオンラインプレビューツールを使えば、1つのペインでMarkdownを書きながら、もう一方でリアルタイムにレンダリングされたHTMLを確認できます — エディタのセットアップ不要、ビルドステップ不要、ブラウザ拡張機能不要。READMEの下書きやブログ記事、ドキュメントのスニペットを貼り付けて、コミットする前にレンダリング結果を正確に確認できます。

Markdownプレビューツールを試す →

Markdownとは

MarkdownはJohn Gruberが2004年に作成した軽量マークアップ言語です。HTMLに変換されるプレーンテキスト構文を使います — **bold**bold になり、# Heading<h1> になります。目標は、クリーンにレンダリングされる読みやすいソーステキストです。

今日Markdownは至るところにあります:

  • GitHubのREADMEとPRの説明
  • ドキュメントサイト(Docusaurus、MkDocs、VitePress)
  • 静的サイトジェネレーター(Astro、Hugo、Jekyll)
  • メモアプリ(Obsidian、Notion、Bear)
  • APIドキュメント(Swaggerの説明、Postmanコレクション)

GitHub Flavored Markdown(GFM)

最も広く使用されているMarkdown方言は**GitHub Flavored Markdown(GFM)**です。CommonMark仕様を開発者向けの機能で拡張しています:

テーブル

| メソッド | エンドポイント       | 説明               |
|---------|--------------------|--------------------|
| GET     | /users             | ユーザー一覧を取得  |
| POST    | /users             | ユーザーを作成      |
| DELETE  | /users/{id}        | ユーザーを削除      |

カラム配置サポート(:---:---:---:)付きのクリーンなHTMLテーブルとしてレンダリングされます。

タスクリスト

- [x] CIパイプラインをセットアップ
- [x] ユニットテストを書く
- [ ] 統合テストを追加
- [ ] ステージングにデプロイ

GitHubのissueとPRでインタラクティブなチェックボックスとしてレンダリングされます。

シンタックスハイライト付きフェンスコードブロック

```javascript
async function fetchUser(id) {
  const res = await fetch(`/api/users/${id}`);
  if (!res.ok) throw new Error(`HTTP ${res.status}`);
  return res.json();
}
```

開始フェンスの後の言語識別子(javascriptpythongobashなど)がほとんどのレンダラーでシンタックスハイライトを起動します。

取り消し線

~~非推奨API~~`/v2/users` を使用してください

自動リンク

GFMはURLを自動的にリンクに変換します:https://example.com[text](url) 構文なしでクリック可能なリンクになります。

コアMarkdown構文リファレンス

見出し

# H1 — ページタイトル
## H2 — 主要セクション
### H3 — サブセクション
#### H4 — 詳細

強調

**太字テキスト**
*イタリックテキスト*
***太字かつイタリック***
`インラインコード`

リンクと画像

[リンクテキスト](https://example.com)
[タイトル付きリンク](https://example.com "ホバータイトル")
![代替テキスト](image.png)
![代替テキスト](image.png "画像タイトル")

リスト

- 順序なし項目
- 別の項目
  - ネスト項目(2スペースインデント)

1. 最初の順序付き項目
2. 2番目の項目
3. 3番目の項目

引用

> これはブロック引用です。
> 
> 複数の段落にまたがることができます。
>> ネストした引用

水平線

---
***
___

インラインHTML

MarkdownはHTMLをそのまま出力に通します。Markdownで表現できないものにはHTMLを混在できます:

<details>
<summary>クリックして展開</summary>

ここに隠れたコンテンツ。

</details>

一般的なMarkdownの使用例

READMEファイル

構造化されたREADMEの典型的な内容:

# プロジェクト名

何をするかの短い説明。

## インストール

```bash
npm install my-package

使用方法

import { myFn } from 'my-package';
myFn({ option: true });

API

オプションデフォルト説明
debugbooleanfalseデバッグログを有効化
timeoutnumber5000リクエストタイムアウト (ms)

ライセンス

MIT


### APIドキュメント

MarkdownはOpenAPIに投資する前のRESTAPIドキュメント化に最適です:

```markdown
## POST /auth/token

JWTアクセストークンとクレデンシャルを交換します。

**リクエストボディ**

```json
{
  "email": "user@example.com",
  "password": "secret"
}

レスポンス 200

{
  "token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...",
  "expiresIn": 3600
}

レスポンス 401 — 無効なクレデンシャル。


### 変更ログ

Keep a Changelog形式はMarkdownを使います:

```markdown
## [2.1.0] — 2026-03-15

### 追加
- ダークモードサポート
- クイック検索のキーボードショートカット (Cmd+K)

### 修正
- Windowsでの行末正規化 (#234)
- WebSocketハンドラーのメモリリーク (#241)

### 非推奨
- `legacyAuth()` — 代わりに `authenticate()` を使用

Markdownの方言:何を使うべきか

方言使用場所主な追加機能
CommonMark汎用ベースライン厳格な仕様、一貫性
GFMGitHub、GitLab、Giteaテーブル、タスクリスト、自動リンク
MDXReact/AstroサイトMarkdown内のJSXコンポーネント
MultiMarkdown学術論文脚注、引用
Pandoc Markdownドキュメント変換LaTeX数式、引用

ほとんどの開発コンテンツにはGFMが適切な選択です。静的サイトではMDXでフルコンポーネントパワーが使えます。

Markdownプレビュー vs ローカルエディタ

アプローチ速度機能セットアップ不要
オンラインプレビュー(ZeroTool)即座GFM + ハイライトYes
VS Code + 拡張機能速いフルエディタインストール必要
ObsidianフルアプリWikiリンク + プラグインインストール必要
GitHub WebエディタオンラインGFMのみログイン必要

オンラインツールは、クイックREADMEの下書き、PRの説明でMarkdownのレビュー、ドキュメントに貼り付ける前のスニペットのレンダリング確認に最速の方法です。

クリーンなMarkdownのためのヒント

一貫した見出し階層 — レベルをスキップしないこと(H1からH3に飛ばない)。スクリーンリーダーとドキュメントジェネレーターは見出しツリーに依存しています。

ブロック要素の前後に空行 — 見出し、コードブロック、リスト、引用の前後に空行を追加。一部のパーサーはなしでは正しくレンダリングしません。

インデントされたコードよりフェンスコードブロックを推奨 — リスト内にネストした場合、コードの4スペースインデントは曖昧です。言語タグ付きのフェンスブロックは明示的でシンタックスハイライトをサポートします。

繰り返しURLには参照リンク — 長いURLを何度も繰り返す代わりに、参照スタイルリンクを使います:

詳細については[MDNドキュメント][mdn]を参照してください。
[MDN][mdn]サイトにもガイドがあります。

[mdn]: https://developer.mozilla.org

改行に末尾スペースを避ける — 末尾の2スペース改行(line \n)は見えないのでエラーが起きやすいです。代わりに <br> を使うか、段落を再構成してください。

今すぐMarkdownをプレビュー

ZeroToolのMarkdownプレビューはフルシンタックスハイライトでGitHub Flavored Markdownをリアルタイムにレンダリングします。コンテンツを貼り付けて即座に結果を確認 — サインアップ不要、100%ブラウザベースです。

Markdownプレビューを開く →