グラデーション 青・紫

image2 image8

このテーマの特徴

テーマの特徴:

カラフルなグラデーションのヘッダーとフッター: * ヘッダーとフッターは、青と紫のグラデーションを使用し、スタイリッシュで目立つデザインになっています。

大規模なタイトルセクション: * タイトルセクションは、青色の背景と白いフォントを使用し、プレゼンテーションのメイントピックに焦点を当てています。

列表示のコンテンツ: * 各セクションは縦に並ぶ列で表示され、プレゼンテーションの内容を整理して見やすくしています。

固定フッター: * フッターはページの下部に固定され、プレゼンテーションを通じて常に表示されます。プレゼンテーションの概要や連絡先情報を表示するのに便利です。

カスタムフォントサイズ: * テーマでは、フォントサイズがカスタマイズされています。タイトルは大きく強調表示され、他のコンテンツは読みやすいサイズになっています。

ドロップシャドウエフェクト: * ヘッダーとフッターにドロップシャドウエフェクトが追加されており、プレゼンテーションに奥行きと洗練された印象を与えています。

タイトルセクションの独自フッター: * タイトルセクションには独自のフッターがあり、他のセクションとは異なる内容を表示できます。これは、追加の情報を提供したり、作者に関する詳細を表示したりするために使用できます。

このテーマを利用する

CSS

/* @theme custom_theme */
@import default;

section{
  display: flex;
  flex-direction: column;
  font-size: 24pt;
}

header{
  width: 100%;
  background: linear-gradient(to right, #2980b9, #8e44ad);
  color: white;
  top: 0px;
  height: 70px;
  padding: 15px;
  font-size: 20pt;
  box-shadow: 0 2px 5px #888888;
}

footer{
  width: 100%;
  background: linear-gradient(to right, #8e44ad, #2980b9);
  color: white;
  position: fixed;
  padding: 15px;
  margin-top: 30px;
  bottom: 0px;
  font-size: 14pt;
  text-align: center;
  box-shadow: 0 -2px 5px #888888;
}

section.title{
  background-color: #3498db;
  color: white;
  padding: 50px;
  font-size: 48pt;
  margin-bottom: 30px;
}

section.title footer{
  position: relative;
  margin-top: auto;
}

Marpのサンプル

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


# タイトル

---


# 見出し
- これはリスト
- これもリスト