夜の都市

このテーマの特徴

Neon Cityテーマ

このCSSテーマは、ネオンサインと都市の景観をイメージした、鮮やかで魅力的なスタイルです。

特徴:

• 暗い背景: スライドの背景色は#212121のダークグレーです。
• ネオンのアクセント: ヘッダー、フッター、タイトルセクションは、ネオンレッド(#c92a2a)とネオンパープル(#4d194d)のグラデーションを使用しています。
• タイトルセクション: タイトルセクションは中央揃えで、黄色のネオン(#f5af19)の背景色を使用しています。
• 目立つフォント: フォントサイズは大きく（18ptから48pt）、太字で、鮮やかな白色(#f5f5f5)を使用しています。
• テキストの強調: テキストには、わずかなドロップシャドウが追加されており、立体感があります。

このテーマは、印象的で目を引くプレゼンテーションを作成するのに最適です。特に、都市、技術、または夜間の雰囲気を表現したい場合に向いています。

このテーマを利用する

CSS

/* @theme neon_city */
@import default;

section{
  background-color: #212121;
  color: #f5f5f5;
  padding: 20px;
  font-size: 18pt;
}

header{
  width: 100%;
  background: linear-gradient(to right, #c92a2a, #4d194d);
  color: white;
  height: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  font-size: 24pt;
  font-weight: bold;
  text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
  border-bottom: 8px solid #f5af19;
}

footer{
  width: 100%;
  position: fixed;
  padding: 20px;
  background: linear-gradient(to right, #4d194d, #c92a2a);
  color: white;
  bottom: 0px;
  text-align: center;
  font-size: 14pt;
  font-weight: bold;
  border-top: 8px solid #f5af19;
}

section.title{
  background-color: #f5af19;
  color: white;
  padding: 60px 40px;
  text-align: center;
  font-size: 36pt;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 40px;
  text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
}

section.title h1{
  font-size: 48pt;
  font-weight: bold;
}

section.title p{
  font-size: 24pt;
  font-weight: normal;
}

.button{
  background-color: #f12711;
  color: white;
  padding: 10px 20px;
  border-radius: 5px;
  font-size: 16pt;
  font-weight: bold;
  text-decoration: none;
}

.button:hover{
  background-color: #f5af19;
  color: white;
}

::selection {
  background-color: #f5af19;
  color: #212121;
}

::-moz-selection {
  background-color: #f5af19;
  color: #212121;
}

Marpのサンプル

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

<!--
_class: title
-->

# カテゴリー：サイズ別

---
## 標準

**アスペクト比：** 16:9
**解像度：** 1280 x 720 ピクセル
**デザインの特徴：**
* 情報が明瞭で視覚的にわかりやすい
* フォントは読みやすく、見出しと本文が区別されている
* 色やグラフィック要素は調和が取れ、目を引く

---
## ワイド

**アスペクト比：** 16:9
**解像度：** 1920 x 1080 ピクセル
**デザインの特徴：**
* 幅広い画面に対応し、より多くの情報を表示できる
* 視覚効果を強化する背景画像やグラフィックを使用する
* 一目で多くの情報を伝えるために、タイトルや要点が目立つ

---
## カスタム

**アスペクト比と解像度：** クライアントの指定による
**デザインの特徴：**
* 特定のプレゼンテーションまたはブランドのニーズに合わせてカスタマイズ
* ユニークな形やレイアウトを使用して、注目を集める
* クライアントの指示に従って、特定のメッセージや美学を伝える