Markdown記法ガイド

日常的に使うMarkdownのためのわかりやすいチートシートです。各ブロックで記法と実際の結果を示します。

Markdownとは？

Markdownは、プレーンテキストに書式を加えるための軽量な記法です。ボタンやメニューの代わりに、見出しを表す#や強調を表す*など、いくつかのシンプルな記号を使います。テキストのままでも読みやすいのが特長です。

2004年にJohn GruberとAaron Swartzによって作られ、README、ドキュメント、メモ、GitHubやRedditのようなサイトの標準として使われるようになりました。ただのテキストなので、あなたの文章はどこへ持ち出しても読みやすいまま保たれます。

このガイドでは、よく使う記法を紹介します。Markdown Peekで好きな例を開き、スペースを押してソースとレンダリング結果を切り替えてみてください。

見出し

行の先頭に#を1〜6個つけます。#が多いほど、小さく深い階層の見出しになります。

Markdown

# Heading 1
## Heading 2
### Heading 3
#### Heading 4

結果

Heading 1

Heading 2

Heading 3

Heading 4

太字、斜体など

記号でテキストを囲んで強調します。自由に組み合わせられます。

Markdown

**Bold text**
*Italic text*
***Bold and italic***
~~Strikethrough~~
`Inline code`

結果

Bold text

Italic text

Bold and italic

~~Strikethrough~~

Inline code

リンク

表示するテキストを角括弧に、リンク先を丸括弧に入れます。

Markdown

[Markdown Peek](https://markdownpeek.com)
<https://markdownpeek.com>

結果

Markdown Peek

https://markdownpeek.com

画像

画像は先頭に感嘆符を付けたリンクです。角括弧内のテキストが代替テキストになります。

Markdown

![A cat looking up](cat.jpg)

結果

引用

行の先頭に>を付けると引用になります。>を重ねると、引用の中に引用を入れ子にできます。

Markdown

> A quote worth remembering.
>
> > And a nested one.

結果

A quote worth remembering.
And a nested one.

コード

インラインコードは単一のバッククォートで、コードブロック全体は3つのバッククォートで囲みます。言語名を付けることもできます。

Markdown

Use `backticks` for inline code.

```js
function hi() {
  console.log("Hello");
}
```

結果

Use backticks for inline code.

function hi() {
  console.log("Hello");
}

表

列はパイプで区切り、見出し行の下をハイフンで区切ります。コロンで揃え方を指定します。

Markdown

| Feature | Supported |
|---------|:---------:|
| Tables  | Yes       |
| Code    | Yes       |

結果

Feature	Supported
Tables	Yes
Code	Yes

水平線

ハイフン、アスタリスク、アンダースコアを3つ以上、単独の行に書くと区切り線になります。

Markdown

Above the line.

---

Below the line.

結果

Above the line.

Below the line.

タスクリスト

[ ]を付けたリスト項目は未完了のタスク、[x]は完了したタスクです。

Markdown

- [x] Read the guide
- [ ] Set as default app

結果

Read the guide
Set as default app

文字のエスケープ

記号の前にバックスラッシュを置くと、書式ではなく文字そのものとして表示されます。

Markdown

\*Not italic\*
\# Not a heading

結果

*Not italic*

# Not a heading

LaTeXによる数式

文中の数式は単一のドル記号で、独立した行の数式は二重のドル記号でLaTeXを囲みます。Markdown Peekはどちらもオフラインでレンダリングします。

Markdown

Inline math like $E = mc^2$ works in a sentence.

$$
a^2 + b^2 = c^2
$$

結果

Inline math like E = mc² works in a sentence.

a 2 + b 2 = c 2

Mermaidによる図

mermaidを指定した囲みコードブロックを開き、フローチャートやシーケンス図をプレーンテキストで記述します。Markdown Peekがライトモードでもダークモードでも図を描画します。

Markdown

```mermaid
flowchart LR
  A[Write] --> B[Preview]
  B --> C[Share]
```

結果

Macで美しくMarkdownを読む

Markdown Peekはどんな.mdファイルもクリーンなGitHub風スタイルでレンダリングし、Finderでのクイックルックと、PDFとしての保存に対応しています。Mac App Storeで無料。