シックで読みやすいmarpテーマ「Star Night」

このテーマの特徴

特徴:

• シックで落ち着いたテーマ: 背景色は濃い青 (#002d72) で、見出しや箇条書きは明るい黄色 (#f49b42) を採用し、落ち着いた印象を与える一方で、重要な情報が際立つ配色です。

• 見やすいフォント: フォントサイズは 16pt で読みやすく、フォント色は白 (#ffffff) で背景色とコントラストが強く、ストレスなく読むことができます。

• 目立つ見出し: 見出し (h2) はフォントサイズが大きく、太字で表示されるため、視覚的に目立ち、主要なトピックを簡単に特定できます。

このテーマを利用する

CSS

/* @theme star_night_theme */
@import default;

section{
  --primary-color: #002d72;
  --secondary-color: #f49b42;
  --accent-color: #f7f7f7;
  --font-color: #ffffff;
  --header-height: 60px;
  --footer-height: 20px;
  --padding: 20px;
  --font-size: 16pt;

  display: flex;
  flex-direction: column;
  font-size: var(--font-size);
  padding: var(--padding);
  color: var(--font-color);
  background-color: var(--primary-color);
}

header{
  width: 100%;
  height: var(--header-height);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--padding);
  background-color: var(--secondary-color);
  color: var(--accent-color);
}

footer{
  width: 100%;
  height: var(--footer-height);
  position: fixed;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: var(--padding);
  background-color: var(--primary-color);
  color: var(--accent-color);
}

section.title{
  padding: calc(var(--padding) * 2);
  text-align: center;
  background-color: var(--secondary-color);
  color: var(--font-color);
  font-size: calc(var(--font-size) * 2);
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--padding);
}

section.content{
  padding-top: calc(var(--header-height) + var(--padding));
}

section.content h2{
  font-size: calc(var(--font-size) * 1.5);
  font-weight: bold;
  margin-bottom: var(--padding);
}

section.content ul{
  list-style-type: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--padding);
}

section.content li{
  background-color: var(--accent-color);
  color: var(--font-color);
  padding: var(--padding);
  border-radius: 5px;
  font-size: var(--font-size);
  width: calc(var(--font-size) * 8);
}

section.content p{
  font-size: var(--font-size);
  margin-bottom: var(--padding);
}

Marpのサンプル

---
marp: true
theme: star_night_theme
header: " "
footer: " "
---
<!--
_class: title
-->

# イベント企画のススメ

---
# イベント企画

* イベントの目的を明確にする
* ターゲットオーディエンスを特定する
* 予算を設定する

---
# 会場選び

* 会場タイプを考慮する（例：屋外、屋内）
* 規模やアクセス性を考慮する
* 費用と空き状況を確認する

---
# タイムライン

## 企画段階
- アイデア出し
- 会場決定
- 予算作成

## 実行段階
- 集客
- プログラム準備
- 会場設営

## 開催後
- 振り返り
- 次回への改善

---
# 予算管理

* 収入源を検討する
* 支出を把握する
* 予算を管理する

---
# 集客

* ターゲットオーディエンスを特定する
* 適切なマーケティングチャネルを選択する
* 宣伝を作成する