宇宙の冒険をテーマにしたプレゼンテーションのための洗練された印象的なテーマ

image0 image1

このテーマの特徴

宇宙的な冒険のテーマ

このテーマは、宇宙をテーマにしたスタイリッシュで印象的なプレゼンテーションを作成するのに最適です。

特徴:

  • 暗闇の中での明るさ:黒く深みのある背景に、白いテキストが映え、プレゼンテーションが際立ちます。
  • 宇宙を連想させる配色:ヘッダーとフッターの濃い紫色と、タイトルセクションの明るい紫色が、宇宙空間にいるような雰囲気を演出します。
  • 目立つセクション:タイトルセクションは、鮮やかな紫色を背景に白く大きな文字で設定され、重要なセクションに注意を引きます。

全体として、このテーマは、宇宙に関するトピックのプレゼンテーションや、印象的で記憶に残る視覚体験を求めるプレゼンターに適しています。

このテーマを利用する

CSS

/* @theme cosmic_adventure */
@import default;

section {
  background: #000428;
  color: #ffffff;
  padding: 20px;
  font-size: 24pt;
  line-height: 1.5;
}

header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #000046;
  color: #ffffff;
  padding: 10px 20px;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;
}

footer {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #000046;
  color: #ffffff;
  padding: 10px;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 10;
}

section.title {
  background: #000063;
  color: #ffffff;
  padding: 54px;
  text-align: center;
  font-size: 36pt;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

section.title::before {
  content: "";
  display: block;
  width: 140px;
  height: 140px;
  border: 6px solid #ffffff;
  border-radius: 50%;
  margin: 0 auto 20px;
  animation: spin infinite 20s linear;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NCA2NCI+PHBhdGggZD0ibTMzLjUgMjYuNXM1LjEgMTQuNyAyNC4yIDIxLjkgNDAuNCAxOC45IDU4LjQgMTguOWMwIDAgMjUtOS4zIDQzLjMtMjUuMiAzNy4xLTE1LjEgNjEuOC00Mi4yIDYxLjgtNTEuOGwtLjItNzcuN3MzOS43IDkuMyA0NC41IDI3IDMyLjggNTAuMiAxMS42IDY3LjUtMTkuMyAyMS44LTM4LjkgMjEuOC00Mi42IDAtNzcuNS0zNC4zLTc3LjUtNzEuOSAwLTI1LjEgMTAuNS00Ny40IDMwLjQtNTkuNyA1MC4zLTU5LjkgNDAuNiAwIDc1LjEgMzguMyA3NS43IDc3LjEgMzUuOCA3Ny4xIDcyLjcgMCA0MS45LTI4LjkgNzAuMi01OS43IDQ4LjItNzcuOCAzMi43LTc3LjggNzAuNmwuNyA3Ny4yLTQzLjkgOS4zLTI1LjMgNTAuMy0xMS43IDY3LjkgMzguMyAyMS44IDc3LjQgMjEuOCA0Mi42IDAgNzcuNi0zNC4zIDc3LjYtNzEuOCAwLTI1LjEgLTEwLjUtNDcuNCAzMC40LTU5LjcgNTAuMy01OS44IDQwLjYgMCA3NS4xIDM4LjMgNzUuOCA3Ny4xIDM1LjggNzcuMSAzNy44IDAgNDEuOS0yOC45IDcwLjItNTkuNyA0OC4yIDc3LjggMzIuNyA3Ny44IDcwLjZ6bS00LjYgMTIuNWMtMjguOC0xNC40LTU0LjQtMjMuMi03MS44LTI3LjVjLTQuNi0xLjItOC4zLTIuNC0xMS41LTIuNGMtMy4xIDAtNS43IDEuMS03LjkgMi43Yy0yLjEgMS41LTIuOSAzLjQtMi45IDUuOXYxMC4xbDIwLjggOC44YzIuMi45IDQuNSAyIDYuOCAyYzIuNC4xIDQuOC0uMyA3LjEtMS42YzEuNS0uOSAxLjktMi4yIDEuOS0zLjV2LTcuNGwtMjAuMS04LjljLTIuNy0xLjItNS42LTIuNS04LjUtMi41em0tMjIuOSAyMS41Yy0zLjEgMC01LjgtMS4zLTguMS0zLjljLTIuMi0yLjYtMy4zLTVuNi4xLTExLjhjMi44LTEuNCA1LjYtMi4xIDguNS0yLjFjMy4xIDAgNS44IDEuMyA4LjEgMy45YzIuMiAyLjYgMy4zIDV2Ni4xYy0yLjggMS40LTUuNiAyLjEtOC41IDIuMXpNMzIuMiA0MWMzLjEgMC01LjctMS4yLTguNS0zLjljLTIuOC0yLjctNC4zLTYuOS00LjMtMTJ2LTEuNWMxLjYgMy45IDQuNiA3IDguNSA3YzMuMSAwIDUuNy0xLjIgOC41LTMuOWMyLjgtMi43IDQuMy02LjkgNC4zLTEydjEuN3oiIHN0eWxlPSJmaWxsOiNmZmZmZmYiLz48L3N2Zz4=');
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

section.title h1 {
  font-size: 48pt;
  margin: 0;
}

Marpのサンプル

---
marp: true
theme: custom_theme
header: " "
footer: " "
---

<!--
_class: title
-->

# slide_1

---
<!--
_class: section-1
-->

# slide_2
- これはリスト
- これもリスト

---
<!--
_class: section-2
-->

# slide_3
- リスト
- リスト

---
<!--
_class: section-3
-->

## 見出し
- リスト
- リスト

---