このテーマの特徴
カスタムテーマの特長:
1. 列レイアウト: * 各スライドは単一の列として表示されます。
2. スタイリッシュなヘッダー: * ヘッダーはグラデーション背景があり、見出しとサブ見出しを中央揃えで表示します。
3. 固定フッター: * フッターはページの下部に固定され、常に表示されます。
4. ハイライトされたタイトルスライド: * タイトルスライドは背景色が異なり、中央揃えの大きなフォントで表示されます。
5. タイトルスライドの垂直中央揃え: * タイトルスライド内のコンテンツは、垂直方向に中央揃えされます。
6. ナビゲーションの非表示: * このテーマでは、デフォルトのナビゲーションバーは非表示に設定されています。
7. カラーパレット: * 青と緑のグラデーションが、テーマ全体で使用されています。
8. フォントサイズのカスタマイズ: * スライドのフォントサイズは 24pt に設定されています。ただし、タイトルスライドは 36pt に設定されています。
このテーマを利用する
CSS
/* @theme custom_theme */ @import default; section{ display: flex; flex-direction: column; font-size: 24pt; } header{ display: flex; justify-content: space-between; align-items: center; padding: 10px; background: linear-gradient(to right, #88bcdb, #97d9e1); color: white; font-size: 24pt; } footer{ width: 100%; position: fixed; padding: 15px; background: linear-gradient(to right, #97d9e1, #88bcdb); color: white; bottom: 0px; text-align: center; font-size: 24pt; } section.title{ background-color: #88bcdb; color: white; padding: 50px; font-size: 36pt; text-align: center; display: flex; flex-direction: column; justify-content: center; gap: 20px; }
Marpのサンプル
--- marp: true theme: custom_theme header: " " footer: " " --- <!-- _class: title --> # タイトル --- <!-- _class: normal --> # 見出し - これはリスト - これもリスト