コピペで使える！Markdown記法チートシート完全版

2025年5月28日

markdown

Markdownは、プレーンテキストで書かれた文書を構造化し、HTMLなどの他の形式に簡単に変換できる軽量マークアップ言語です。エンジニアのドキュメント作成、ブログ記事の執筆、メモ取りなど、幅広いシーンで活用されています。このチートシートは、Markdownの主要な記法を網羅し、具体的なサンプルコードと共に紹介しています。

I. テキスト整形・装飾

文章の見た目を整え、情報を効果的に伝えるための基本的な記法です。

見出し (Heading)

見出しは # の数でレベルを表現します。# が1つのものが最も大きな見出しです。

書き方:

markdown# 見出しレベル1 (H1)
## 見出しレベル2 (H2)
### 見出しレベル3 (H3)
#### 見出しレベル4 (H4)
##### 見出しレベル5 (H5)
###### 見出しレベル6 (H6)

表示例:

見出しレベル1 (H1)

見出しレベル2 (H2)

見出しレベル3 (H3)

見出しレベル4 (H4)

見出しレベル5 (H5)

見出しレベル6 (H6)

太字 (Bold)

テキストを太字にするには、アスタリスク ** またはアンダースコア __ 2つで囲みます。

書き方:

markdownこれは **太字のテキスト** です。
これは __太字のテキスト__ です。
**単語**だけを太字にすることも、**フレーズ全体を太字にすることも**可能です。

表示例:

これは 太字のテキスト です。これは 太字のテキスト です。単語だけを太字にすることも、フレーズ全体を太字にすることも可能です。

斜体 (Italic)

テキストを斜体にするには、アスタリスク * またはアンダースコア _ 1つで囲みます。

書き方:

markdownこれは *斜体のテキスト* です。
これは _斜体のテキスト_ です。
*単語*だけでも、*フレーズ全体でも*斜体にできます。
***太字かつ斜体***も可能です。
___太字かつ斜体___も可能です。
**_太字の中に斜体_** もできます。
*__斜体の中に太字__* もできます。

表示例:

これは 斜体のテキスト です。これは 斜体のテキスト です。単語だけでも、フレーズ全体でも斜体にできます。 太字かつ斜体も可能です。 ___太字かつ斜体___も可能です。 太字の中に斜体 もできます。 斜体の中に太字 もできます。

取り消し線 (Strikethrough)

テキストに取り消し線を引くには、チルダ ~~ 2つで囲みます。

書き方:

markdownこれは ~~取り消されたテキスト~~ です。
~~この機能は便利ですね。~~

表示例:

これは ~~取り消されたテキスト~~ です。 ~~この機能は便利ですね。~~

インラインコード (Inline Code)

文中に短いコードを埋め込む場合は、バッククォート ` で囲みます。

書き方:

markdown関数 `printf()` を使用します。
ファイル名は `example.md` です。
`CSS`のプロパティ`font-size`の値は`16px`です。

表示例:

関数 printf() を使用します。ファイル名は example.md です。 CSSのプロパティfont-sizeの値は16pxです。

引用 (Blockquote)

他者の言葉や文章を引用する際には、行頭に > を記述します。複数行にまたがる引用や、ネストした引用も可能です。

書き方:

markdown> これは引用文です。
> 複数行にわたる引用もこのように書けます。

> 引用の中に
>> さらに引用をネストすることも可能です。
>
> > 空行を挟むと、別の引用ブロックになります。

> 強調やリストなども引用内で使用できます。
> - リスト項目1
> - リスト項目2
>
> **太字**も使えます。

表示例:

これは引用文です。複数行にわたる引用もこのように書けます。

引用の中に

さらに引用をネストすることも可能です。

空行を挟むと、別の引用ブロックになります。

強調やリストなども引用内で使用できます。

リスト項目1

リスト項目2

太字も使えます。

II. リスト表現

情報を整理して分かりやすく伝えるために、リストは非常に有効です。

順序なしリスト (Unordered List)

行頭にアスタリスク *、ハイフン -、またはプラス + を記述します。どの記号を使っても同じように表示されますが、1つのリスト内では統一することをお勧めします。

書き方:

markdown* りんご
* バナナ
* オレンジ

- 赤
- 青
- 黄

+ 犬
+ 猫
+ 鳥

表示例:

りんご
バナナ
オレンジ

順序付きリスト (Ordered List)

行頭に数字とピリオド 1. を記述します。数字は自動的に連番になりますので、すべて 1. と記述しても問題ありません。

書き方:

markdown1. 最初の項目
2. 次の項目
3. 最後の項目

1. ステップ1
1. ステップ2 (このように書いても連番になります)
1. ステップ3

表示例:

最初の項目
次の項目
最後の項目
ステップ1
ステップ2 (このように書いても連番になります)
ステップ3

リストのネスト (Nested List)

リスト項目をインデント（通常は半角スペース2つまたは4つ）することで、リストを入れ子にできます。

書き方:

markdown* 果物
  * りんご
    - ふじ
    - ジョナゴールド
  * バナナ
* 野菜
  1. 葉物野菜
     * キャベツ
     * レタス
  2. 根菜
     - 大根
     - 人参

表示例:

果物
- りんご
  - ふじ
  - ジョナゴールド
- バナナ
野菜
1. 葉物野菜
  - キャベツ
  - レタス
2. 根菜
  - 大根
  - 人参

タスクリスト (Task List - GFM)

GitHub Flavored Markdown (GFM) など、一部のMarkdown処理系で利用できるタスクリストです。チェックボックスとして表示されます。

書き方:

markdown- [x] 完了したタスク
- [ ] 未完了のタスク
- [ ] これからやるタスク
  - [x] サブタスク（完了）
  - [ ] サブタスク（未完了）

表示例: (お使いのMarkdownプレビュー環境によって表示が異なります)

III. リンクと画像

他の情報源を参照したり、視覚的な情報を加えたりする際に使用します。

リンク (Link)

[表示するテキスト](URL) の形式で記述します。URLの代わりに、同じサイト内の別ページへのパスを指定することも可能です。

書き方:

markdown[https://t-cr.jp](https://t-cr.jp)
[相対パスの例](./)

表示例:

Google

cursor.sh

相対パスの例

画像 (Image)

![代替テキスト](画像URL) の形式で記述します。代替テキストは、画像が表示されない場合に代わりに表示されるテキストです。リンクと組み合わせて、画像にリンクを貼ることも可能です。

書き方:

markdown![ロゴ画像](/img/common/logo.png "t-cr.jpのロゴ")

[![ロゴ画像へのリンク](/img/common/logo.png)](https://t-cr.jp)

表示例:

参照リンク・参照画像 (Reference Link/Image)

長いURLを文中に何度も記述するのを避けるために、参照スタイルを使用できます。

書き方:

markdownこれは[あるウェブサイト][1]へのリンクです。
そして、これは[別のサイトへのリンク][another site]です。
これが[画像への参照][logo]です。

[1]: https://www.example.com/very-long-url-path
[another site]: https://www.anothersite.org/
[logo]: https://cursor.sh/brand/icon.svg "Cursor アイコン"

表示例:

これはあるウェブサイトへのリンクです。そして、これは別のサイトへのリンクです。これが画像への参照です。

IV. コードブロック

プログラムのソースコードなどを表示する際に使用します。

フェンスドコードブロック (Fenced Code Block)

3つ以上のバッククォート ``` ````` またはチルダ ~~~ でコード部分を囲みます。開始のバッククォートの直後に言語名を指定することで、シンタックスハイライトを有効にできる場合があります。

書き方:

markdown```javascript
function greet(name) {
  console.log(`Hello, ${name}!`);
}
greet('World');
```

```python
def add(x, y):
  return x + y

print(add(5, 3))
```

```
プレーンテキストもこのように表示できます。
特別なハイライトはされません。
```

表示例: (お使いのMarkdownプレビュー環境によってシンタックスハイライトの有無や見た目が異なります)

javascriptfunction greet(name) {
  console.log(`Hello, ${name}!`);
}
greet('World');

pythondef add(x, y):
  return x + y

print(add(5, 3))

プレーンテキストもこのように表示できます。
特別なハイライトはされません。

シンタックスハイライト (Syntax Highlighting)

上記のように、フェンスドコードブロックの開始記号の直後に言語識別子（例: javascript, python, ruby, html, css など）を指定することで、多くのMarkdown処理系がコードを色付けして読みやすく表示してくれます。対応している言語は処理系によって異なります。

書き方 (HTMLの例):

markdown```html
<!DOCTYPE html>
<html>
<head>
  <title>マイページ</title>
</head>
<body>
  <h1>ようこそ！</h1>
  <p>これはHTMLのサンプルです。</p>
</body>
</html>
```

表示例 (HTMLの例):

html<!DOCTYPE html>
<html>
<head>
  <title>マイページ</title>
</head>
<body>
  <h1>ようこそ！</h1>
  <p>これはHTMLのサンプルです。</p>
</body>
</html>

V. 表（テーブル）

情報を整理して比較する際に便利な表を作成できます。

基本的な表の作成方法

パイプ | でセルを区切り、ハイフン - でヘッダー行とデータ行を区切ります。ヘッダー行の下の行には、各列に対して少なくとも3つのハイフンが必要です。

書き方:

markdown| ヘッダー1 | ヘッダー2 | ヘッダー3 |
|---|---|---|
| 内容1-1 | 内容1-2 | 内容1-3 |
| 内容2-1 | 内容2-2 | 内容2-3 |
| 内容3-1 | 内容3-2 | ちょっと長い内容3-3 |

表示例:

ヘッダー1	ヘッダー2	ヘッダー3
内容1-1	内容1-2	内容1-3
内容2-1	内容2-2	内容2-3
内容3-1	内容3-2	ちょっと長い内容3-3

列の揃え指定 (Alignment)

ヘッダー行の下の区切り線にコロン : を追加することで、列の内容の揃え（左寄せ、中央寄せ、右寄せ）を指定できます。

書き方:

markdown| 左寄せヘッダー | 中央寄せヘッダー | 右寄せヘッダー |
|:---|:---:|---:|
| りんご | 150円 | 3個 |
| バナナ | 200円 | 5本 |
| オレンジ | 100円 | 2個 |

表示例:

左寄せヘッダー	中央寄せヘッダー	右寄せヘッダー
りんご	150円	3個
バナナ	200円	5本
オレンジ	100円	2個

VI. その他・拡張機能

Markdownの基本的な機能に加え、知っておくと便利な記法や、一部の処理系でサポートされている拡張機能です。

水平線 (Horizontal Rule)

3つ以上のアスタリスク ***、ハイフン ---、またはアンダースコア ___ を記述することで、水平線を表示できます。行内には他の文字を含めず、これらの記号のみを記述します。

書き方:

markdown***
---
___

表示例:

エスケープ (Escaping Characters)

Markdownで特別な意味を持つ文字（例: *, #, \ など）を、そのまま文字として表示したい場合は、その文字の前にバックスラッシュ \ を記述します。

書き方:

markdown\*これはアスタリスクです\*
\# これはシャープです
\[これは角括弧です\]
\`これはバッククォートです\`
\\ これはバックスラッシュです

表示例:

*これはアスタリスクです* # これはシャープです [これは角括弧です] `これはバッククォートです` \ これはバックスラッシュです

絵文字ショートコード (Emoji - GFMなど)

GitHub Flavored Markdown (GFM) などでは、:emoji_name: のようなショートコードで絵文字を簡単に挿入できます。どのような絵文字が使えるかは処理系に依存します。

書き方: (表示は環境に依存します)

markdown:+1: :smile: :rocket:
GitHubではよく使います :octocat:

表示例: (お使いのMarkdownプレビュー環境によって表示が異なります)

:+1: :smile: :rocket: GitHubではよく使います :octocat:

フットノート (Footnotes - 拡張構文)

一部のMarkdown処理系（Pandoc、Markdown Extraなど）では、フットノート（脚注）を利用できます。

書き方:

markdownこれが本文で、ここに脚注への参照があります。[ここが脚注です。][^1]
そして、これがもう一つの脚注です。[脚注2][^another]

[^1]: これは最初の脚注の内容です。
[^another]: これは別の脚注の内容で、少し長めに書くこともできます。
    段落を分けることも可能です。

表示例: (お使いのMarkdownプレビュー環境がフットノートに対応している場合に表示されます)

これが本文で、ここに脚注への参照があります。[ここが脚注です。]¹ そして、これがもう一つの脚注です。[脚注2]²

HTMLタグの利用

多くのMarkdown処理系では、Markdown記法の中に直接HTMLタグを記述することが許可されています。Markdownだけでは表現が難しい複雑なレイアウトや装飾を行いたい場合に便利ですが、使いすぎるとMarkdownのシンプルさが損なわれる可能性もあります。

書き方:

markdown<p style="color: red;">このテキストは赤色で表示されます。</p>

<table>
  <tr>
    <th>HTMLの表ヘッダー1</th>
    <th>HTMLの表ヘッダー2</th>
  </tr>
  <tr>
    <td>HTMLの表データ1</td>
    <td>HTMLの表データ2</td>
  </tr>
</table>

Markdownの中に<details>タグを使うこともできます。
<details>
  <summary>詳細はこちら</summary>
  <p>ここに詳細な情報を記述します。</p>
</details>

表示例: (HTMLタグの解釈はMarkdown処理系や表示環境に依存します)

Markdownの中にタグを使うこともできます。

実践コピペサンプル集

日常的なドキュメント作成でよく使われるMarkdownの組み合わせ例やテンプレートです。

よく使う組み合わせのサンプルコード

サンプル1: 強調とリストを組み合わせた箇条書き

markdown### 会議の議題
- **最重要項目**: 新製品Aの進捗報告
  - *現状分析*
  - _今後の課題_
- 通常項目
  1. 先週の議事録確認
  2. ~~予算案の検討~~ (延期)
  3. その他 (`自由討議`)

表示例:

会議の議題

最重要項目: 新製品Aの進捗報告
- 現状分析
- 今後の課題
通常項目
1. 先週の議事録確認
2. ~~予算案の検討~~ (延期)
3. その他 (自由討議)

サンプル2: 引用とコードブロック

markdown> ユーザーからのフィードバックで、以下のエラーメッセージが表示されるとの報告がありました。
>
> ```
> Error: Cannot find module 'example-module'
> Require stack:
> - /path/to/your/project/app.js
> ```
>
> この問題については、`package.json`の依存関係を確認する必要がありそうです。

表示例:

ユーザーからのフィードバックで、以下のエラーメッセージが表示されるとの報告がありました。
arduinoError: Cannot find module 'example-module'
Require stack:
- /path/to/your/project/app.js
この問題については、package.jsonの依存関係を確認する必要がありそうです。

ブログ記事のテンプレート例

markdown# ブログ記事のタイトル

![アイキャッチ画像](画像URL "画像の簡単な説明")

# はじめに

この記事では、[記事のテーマ]について解説します。
読者の方がこの記事を読むことで、[得られるメリットや知識]を理解できるようになることを目指します。

# [セクション1のタイトル]

[セクション1の内容]

```javascript
// サンプルコードなど
console.log("Hello, Markdown!");
```

# [セクション2のタイトル]

[セクション2の内容]

| 特徴      | 詳細                  |
| :-------- | :-------------------- |
| **メリット** | 簡潔に書ける          |
| デメリット  | 複雑な表現には不向き |

# まとめ

この記事では、[記事のテーマ]について、[主要なポイントの要約]を説明しました。
Markdownを活用して、効率的な情報発信をしましょう！

# 参考リンク

- [関連する公式サイトへのリンク](URL)
- [参考にした記事へのリンク](URL)

READMEファイルの基本構成例 (GitHub向け)

markdown# プロジェクト名

![プロジェクトのロゴやスクリーンショット](画像URL)

> プロジェクトの一言説明やキャッチフレーズ

このリポジトリは、[プロジェクトの目的や概要]のためのものです。

# ✨ 特徴 (Features)

- 🚀 超高速な処理
- 🎨 美しいUI
- 🧩 拡張性の高いプラグインシステム

# 🛠️ 技術スタック (Tech Stack)

- フロントエンド: React, TypeScript, Next.js
- バックエンド: Node.js, Express
- データベース: PostgreSQL
- その他: Docker, Storybook

# 🏁 はじめ方 (Getting Started)

## 前提条件 (Prerequisites)

- Node.js (v18.x 以上)
- Yarn (v1.22.x 以上)

## インストール (Installation)

1. リポジトリをクローンします:
   ```bash
   git clone https://github.com/your-username/your-project.git
   cd your-project
   ```
2. 依存関係をインストールします:
   ```bash
   yarn install
   ```
3. 開発サーバーを起動します:
   ```bash
   yarn dev
   ```
   ブラウザで `http://localhost:3000` を開いてください。

# 📖 使い方 (Usage)

[プロジェクトの基本的な使い方や主要な機能について説明します]

```
// 簡単な使用例
import { usefulFunction } from 'your-project';
usefulFunction();
```

# 🤝 コントリビュート (Contributing)

コントリビューションを歓迎します！バグ報告、機能提案、プルリクエストなど、お気軽にお寄せください。
詳細は `CONTRIBUTING.md` をご確認ください。

# 📝 ライセンス (License)

このプロジェクトは [ライセンス名 (例: MIT License)](./LICENSE) のもとで公開されています。

# 🙏 謝辞 (Acknowledgements)

- [参考にしたライブラリやツール]
- [インスピレーションを与えてくれたプロジェクト]

Markdownエディタ・ツール紹介

Markdownを快適に書くためのエディタや、便利なツールを紹介します。

主要なエディタと特徴

エディタ名	特徴	プラットフォーム	価格
VS Code	豊富な拡張機能、Git連携、プレビュー機能が強力。エンジニアに人気。	Windows, macOS, Linux	無料
Obsidian	ローカル環境で動作する高機能なノートアプリ。リンク機能が強力。	Windows, macOS, Linux	基本無料
Typora	WYSIWYGに近いシームレスな編集体験。	Windows, macOS, Linux	有料
iA Writer	執筆に集中できるミニマルなデザイン。	macOS, iOS, Windows	有料
MarkText	オープンソースのMarkdownエディタ。リアルタイムプレビューが優秀。	Windows, macOS, Linux	無料
Notion	多機能なワークスペースツール。Markdown記法もサポート。	Web, Desktop, Mobile	基本無料
StackEdit	WebベースのMarkdownエディタ。Google Drive等と同期可能。	Web	無料

プレビューツール、整形ツール

Markdown Preview Enhanced (VS Code拡張機能): VS CodeでMarkdownをプレビューするための定番拡張機能。数式、ダイアグラム、プレゼンテーション作成など多機能。
Prettier (コードフォーマッター): Markdownファイルの整形（フォーマット）もサポート。コードスタイルを統一できます。
Dillinger.io (オンラインエディタ): ブラウザ上で動作するシンプルなMarkdownエディタ兼プレビューア。
Pandoc (ドキュメントコンバーター): MarkdownファイルをHTML, PDF, Wordなど様々な形式に変換できる強力なコマンドラインツール。

まとめ

このMarkdownチートシートが、あなたのドキュメント作成や情報発信の一助となれば幸いです。Markdownはシンプルながらも奥が深く、一度慣れると手放せないツールとなるでしょう。

今回紹介した基本的な記法から応用的なテクニックまで、実際に手を動かして試してみてください。そして、日々の業務や学習、趣味の活動にMarkdownを積極的に取り入れ、その便利さを実感していただければと思います。

このチートシートをブックマークやお気に入りに登録して、必要な時にいつでも参照できるようにしておくと便利です。さあ、今日からあなたもMarkdownマスターを目指しましょう！

コピペで使える！Markdown記法チートシート完全版

I. テキスト整形・装飾

見出し (Heading)

見出しレベル1 (H1)

見出しレベル2 (H2)

見出しレベル3 (H3)

見出しレベル4 (H4)

見出しレベル5 (H5)

見出しレベル6 (H6)

太字 (Bold)

斜体 (Italic)

取り消し線 (Strikethrough)

インラインコード (Inline Code)

引用 (Blockquote)

II. リスト表現

順序なしリスト (Unordered List)

順序付きリスト (Ordered List)

リストのネスト (Nested List)

タスクリスト (Task List - GFM)

III. リンクと画像

リンク (Link)

画像 (Image)

参照リンク・参照画像 (Reference Link/Image)

IV. コードブロック

フェンスドコードブロック (Fenced Code Block)

シンタックスハイライト (Syntax Highlighting)

V. 表（テーブル）

基本的な表の作成方法

列の揃え指定 (Alignment)

VI. その他・拡張機能

水平線 (Horizontal Rule)

エスケープ (Escaping Characters)

絵文字ショートコード (Emoji - GFMなど)

フットノート (Footnotes - 拡張構文)

HTMLタグの利用

実践コピペサンプル集

よく使う組み合わせのサンプルコード

会議の議題

ブログ記事のテンプレート例

READMEファイルの基本構成例 (GitHub向け)

Markdownエディタ・ツール紹介

主要なエディタと特徴

プレビューツール、整形ツール

まとめ

関連リンク

Footnotes

markdownの記事Markdown

記事Article

Tailwind で状態に応じたスタイル切替：hover, focus, active の使いこなし方

開発者必見！Claude Code で実現する高度な AI エージェント開発

GPT-4.1、使ってみた！ GPT-4oと何が違うのか、正直な感想

Zustandでの非同期処理とfetch連携パターン（パターン 4: WebSocket とリアルタイム更新）

【徹底比較】Claude 4 vs GPT-4.1 vs Gemini 2.5 Pro - どれが最強の AI なのか

Tailwind のレスポンシブ対応完全解説：画面サイズ別デザインの基本と応用