This is a very savvy headline

.. with some text below

• a bullet point is initiated by single hyphen -

• page numbers on the lower right are globally activated using
  <!-- paginate: true -->

• page breaks are caused by triple hyphen ---

a sub-heading on the 2nd page

a leading underscore _ in directives applies them locally such that
<!-- _paginate: false -->
results in page number suppression on this slide only

layout

themes

• there are alternative themes such as
  <!-- theme: gaia -->
<!-- theme: uncover -->

• with classes
  <!-- class: invert --> for color theme inversion
  <!-- class: lead --> for central alignment in gaia

• the aspect ratio of slides is set via
  size: 16:9 or size: 4:3

header and footer

the global page layout in these slides was set via

header: '[◇](#1 " ")'

footer: 'Slides by [Chris](http://www.christopherhahne.de)'

export slides

1. install node.js from https://nodejs.org/en/download/ and verify it was successful

which node
node --version

2. install marp-cli

npm install --save-dev @marp-team/marp-cli

3. convert file

npx @marp-team/marp-cli your.md --pdf
npx @marp-team/marp-cli your.md --html
npx @marp-team/marp-cli your.md --pptx

scientific stuff

inline math delimiters $ as used in $\alpha = \arcsin\left({s}\right)$ will render within a sentence as . A separated math block employs $$ delimiters and yields

syntax highlighting

JSON

{
  "firstName": "John",
  "lastName": "Smith",
  "age": 25
}

Python

for x in "banana":
  print(x)

tables

| Tables   |      Are      |  Cool |
|----------|:-------------:|------:|
| col 1 is |  left-aligned | $1600 |
| col 2 is |    centered   |   $12 |
| col 3 is | right-aligned |    $1 |

from https://www.tablesgenerator.com/markdown_tables

styles

background paint with font color selection

<!-- backgroundColor: pink --> selects the background
<!-- color: white --> selects the font color

gradient background

backgrounds may be customized using the following directive

<!-- backgroundImage: "linear-gradient(to bottom, #67b8e3, #F288d1)" -->

image insertion

graphics may be defined as

![width:350px](link)  ![height:7cm opacity:.5 blur:2px](link)

with horizontal spacings from as many   as required

video links

videos are linked via

[![video alt text](img link)](url link "description")

and require a media player or stable internet connection at the presentation location

Split backgrounds with specified size

other stylistic markdowns for highlighting include

• ... from `...` as surrounded backticks
• italic from *italic*
• bold from **bold**
• strikethrough from ~~strikethrough~~

• blockquote from >

• source link from [source link](http://www.website.com)
• and some fancy emojis from :shit: using words surrounded by colons

an emoji compilation for markdown is found below

https://gist.github.com/rxaviers/7360908

Outline

for outline entries you may use x. [section](#page_num) as in

1. opening slide
2. layout
3. export slides
5. syntax
6. tables
7. styles

Links for further reading:

https://marpit.marp.app/directives

https://github.com/marp-team/marp-core

https://github.com/marp-team/marp-core/tree/master/themes

https://marpit.marp.app/image-syntax

https://code.visualstudio.com/docs/languages/markdown