母の日

image0 image1

このテーマの特徴

love_and_gratitude テーマの特徴:

  • 暖かみのあるパステルカラーのグラデーション:ヘッダーとフッターには、柔らかく愛らしいパステルカラーのグラデーションが使用されており、愛と感謝の雰囲気を醸し出しています。

  • 整然としたレイアウト:セクションは縦方向に整然と配置されており、読みやすく明確です。

  • 強調されたタイトル:タイトルセクションは、背景色が異なり、周囲に境界線があり、より目立たせ、重視させています。

  • センター揃えされた配置:ヘッダー、フッター、タイトルセクションはすべて、全体的に調和のとれたバランスのとれた印象を与えるように、センター揃えで配置されています。

  • 影と境界線:タイトルセクションに影と境界線が追加されており、奥行きと視覚的な興味が生まれています。

全体として、love_and_gratitude テーマは、柔らかく愛らしい雰囲気のプレゼンテーションを作成するのに最適です。重要な情報を強調し、読みやすく、個人的で魅力的なタッチを加えます。

このテーマを利用する

CSS

/* @theme love_and_gratitude */
@import default;

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

header{
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 15px;
  background-image: linear-gradient(to right, #ffcdd2, #ef9a9a);
  color: #ffffff;
  font-size: 24pt;
  font-family: 'Dancing Script', cursive;
}

footer{
  width: 100%;
  position: fixed;
  padding: 10px;
  background-image: linear-gradient(to right, #ef9a9a, #ffcdd2);
  color: #ffffff;
  bottom: 0px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 10px;
  font-family: 'Dancing Script', cursive;
}

section.title{
  background-color: #f8f9fa;
  color: #6c757d;
  padding: 50px;
  text-align: center;
  font-size: 36pt;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 20px;
  border: 1px solid #6c757d;
  border-radius: 10px;
  box-shadow: 0px 0px 10px #00000029;
}

Marpのサンプル

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

# 母の日
温かいハートに囲まれて

---

## 目次
- お母さんへ贈る言葉
- お母さんのためのプレゼント
- お母さんとの思い出

---
<!--
_class: text-left
-->

## お母さんへ贈る言葉
優しいあなたへ
いつもありがとう

---
<!--
_class: text-center
-->

## お母さんのためのプレゼント
愛と感謝を込めて
このプレゼントをお届けします

---
<!--
_class: text-right
-->

## お母さんとの思い出
あの日の笑顔は宝物
ずっと忘れません