Introducing Gaia theme

Marp's new slide theme

Created by Yuki Hattori (@yhatt)

---

In Greek mythology, Gaia also spelled Gaea, was the personification of the Earth and one of the Greek primordial deities.

-- Gaia (mythology) - Wikipedia, the free encyclopedia

---

Overview

Gaia is the beautiful presentation theme on Marp!

• New features
  1. Title Slides
  2. Highlight
  3. Color scheme

---

How to use

From menu

Select menu: View :arrow_right: Theme :arrow_right: Gaia

Use directive

Set gaia theme by $theme Global Directive.

<!-- $theme: gaia -->

---

Basic example 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. :smile:

Stay Hungry. Stay Foolish. --Steve Jobs (2005)

• List A
  1. Sub list
  2. Sub list
     • More Sub list

---

Basic example 2

document.write('Hello, world!');

table	layout	example
align to left	align to center	align to right
:arrow_left: left	:arrow_left: center :arrow_right:	right :arrow_right:

---

Introduce new features!!

1. Title Slides

---

e.g. This page :yum:

---

Apply centering to the page
that has only headings!

Useful to title slide. :laughing:

---

Tips: Apply vertical centering to quote only page too.

---

2. Highlight

---

Highlight Markup

You can use == for highlighting blue.

==This is highlight markup.==

Notice

Marp would show yellow marker highlight in Markdown view or default slide theme.

---

3. Color scheme templates

---

Color scheme templates

Change color scheme by template page directive.

<!-- template: default -->

• Default :arrow_left: This page
• Invert
• Gaia (Theme color)

---

# ==Color== scheme templates

Change color scheme by template page directive.

<!-- template: invert -->

• Default
• Invert :arrow_left: This page
• Gaia (Theme color)

---

# ==Color== scheme templates

Change color scheme by template page directive.

<!-- template: gaia -->

• Default
• Invert
• Gaia (Theme color) :arrow_left: This page

---

Templates can use
to per pages!

with using temporally page directive <!-- *template: invert -->

---

That's all!

Let's create beautiful slides
with Marp + Gaia theme!

---

<!-- $theme: gaia --> of Marp

https://yhatt.github.io/marp