my-marp-themes

My custom Marp themes

Marp is used to create presentations in Markdown. In this repository, you may find simple CSS themes that I have created.

`beam`

Inspired by / based on LaTeX’s beamer class

[!TIP]

Download and install the Computer Modern Unicode font family for best results

Follow the tutorial to change the primary colors

Download the CSS file:

https://rnd195.github.io/my-marp-themes/beam.css

More screenshots on the community themes website

beam sample

`border`

Based on the default Marp theme

[!NOTE]

The theme imports a font from Google Fonts (see Privacy notice below)

Download the CSS file:

https://rnd195.github.io/my-marp-themes/border.css

More screenshots on the community themes website

border sample

`gradient`

Based on the default Marp theme

[!NOTE]

The theme imports a font from Google Fonts (see Privacy notice below)

Download the CSS file:

https://rnd195.github.io/my-marp-themes/gradient.css

More screenshots on the community themes website

gradient1 sample

gradient, class blue

gradient-blue

`graph_paper`

Based on the default Marp theme

[!NOTE]

The theme imports a font from Google Fonts (see Privacy notice below)

Download the CSS file:

https://rnd195.github.io/my-marp-themes/graph_paper.css

More screenshots on the community themes website

graph_paper

Installation

For users of the VSCode Marp extension:

Open Settings in VSCode (Ctrl + ,)
Search for “Marp: Themes” or “markdown.marp.themes”
Add either
- A local path to the CSS file
- Or a link to the CSS file
  - Please, instead of linking to the raw file on GitHub, consider forking the repository and hosting the CSS files yourself (using, for example, GitHub Pages)
Enable the theme in the front-matter of the Markdown document, i.e., write the following at the very beginning of the Markdown document:

---
marp: true
theme: theme_name
---

Try restaring VSCode if it doesn’t work right away

Below is a template for some common settings using the graph_paper theme:

---
marp: true
theme: graph_paper
paginate: true
size: 4:3
header: This is a header
footer: This is a footer
title: Marp custom themes
---

Follow the official documentation for more options.

License

The beamer-inspired beam theme is licensed under GNU GPLv3. Parts of the beamer class are dual-license with one option being the GNU GPLv2. The rest of the repository is licensed under the MIT License.

Attribution

The beam, border, graph_paper, and gradient themes are based on the default Marp themes made by yhatt. The border and gradient themes import the Inter font by Rasmus Andersson. The graph_paper theme imports the Work Sans font by Wei Huang.

Privacy notice

Please, be aware that by using some of the CSS themes (namely border, gradient, and graph_paper) you import fonts from the Google Fonts service. Please, refer to their Privacy FAQ for more information about using their service.

The CSS files are also hosted on the GitHub Pages site of this repository (deployed from the live branch). The site is automatically built after each commit.

This site is open source. Improve this page.