概要

TopotalのスライドデザインをベースにしたMarpテーマです。

参考リンク

サンプルスライド

こちらのリンクからサンプルスライドをみることができます。
https://topotal.github.io/topotal-marp-theme/sample-slide.html

Github

https://github.com/topotal/topotal-marp-theme

Marp 公式サイト

https://marp.app/

特徴

マークダウンでスライド作成

Topotalのスライドデザインのスライドがマークダウンで作成可能

豊富な要素対応

テーブル、コードブロック、引用など、マークダウン要素に対応

生成AIで作りやすい

生成AIに内容、README.md、sample-slide.mdを入力して爆速でスライド作成可能

CLIでの利用

1. GithubからテーマのCSSファイルをダウンロード

2. Marp形式で作成したマークダウンファイルを用意

3. Markdownファイルの先頭でテーマを指定

4. 以下のコマンドを実行

npx @marp-team/marp-cli@latest slide.md --theme your-directory/topotal-theme.css

テーマの指定方法

Markdownファイルの先頭に以下のFront Matterを記述します

---
marp: true
theme: topotal
---

これだけでTopotalのデザインテーマが適用されます！

細かい内容はサンプルスライドをご覧ください！

https://topotal.github.io/topotal-marp-theme/sample-slide.html

AIを使ってスライドを作成する方法（オススメ）

1. スライドの内容を考える
2. sample-slide.mdのテキストをコピー（下図参照）
   リンク: https://github.com/topotal/topotal-marp-theme/blob/main/sample-slide.md
3. AIツール(Cursor, Claude Codeなど)のチャット欄に貼り付け

{sample-slide.mdのコピペ}
このテンプレートを使って〇〇.mdの内容のMarpスライドを作成して〇〇.mdに出力してください。

4. スライドの内容、レイアウト、画像のサイズを調整