Attributes

Presentation Markdown differentiates itself from normal Markdown through the introduction of small additions to accomodate presentations, such as animations. One addition is the ability to insert presenter notes , the other is the ability to customize elements - such as lists - via attributes.

Attributes always go before an element preceded by a :: (with the exception of slides). For example, to tell a headline that it should have a font size of 200%, you'd enter the following markdown:

:: size: 200
# I am a Headline

The syntax is always the same. If you have more than one attribute to set, you just separate the attributes by a comma. For example, if you want to disable animations and set the font size to 50% for a headline, you'd enter:

:: size: 50, animate: off
# I am another headline

Similarly, if you want to change the font of a headline and a paragraph on your slide, you'd write:

:: size: 200
# Observe the headline

:: size: 200
Now observe the paragraph of beautiful text, written to awe and impress the audience.
Note

Note that in this case you could just change the font size of the whole slideor even change the general font size of the whole presentation in the settings

General Attributes

There're two attributes that are general for all elements. This means that each element in Presentation Markdown (say a Headline or a List) can use these attributes. These attributes are size and animate. All the other attributes are particular to their elements, such as lists , quotes , slides or tables .

Size

The first one is the size attribute. It allows to change the size with which the element is displayed on the slide. This works for headlines, images, even for source code or tables.

The default value is 100. Anything smaller than 100 makes the element smaller, anything bigger than 100 makes the element bigger.

Set the headline size to 150%

Syntax

:: size: 150
# Hello World

Set the image size to 50%

:: size: 50
![image](image.png)

Animation

The other general attribute is the animate attribute. It allows you to add a move in animation to an element. This animation is used when the element enters the slide. This attribute has many different settings, based on the animation you'd want to set up. Thankfully, Hyperdeck has nice Inspectors to greatly simplify this.

Syntax

A simple fade in animation that takes 1.0 seconds looks like this:

:: animate: (1.00; fade)
# I am a headline that fades in

The animation keyword is animate and is followed by parentheses with 2-3 parameters. In this case the first parameter is the duration of 1.0 seconds, the second is the name of the animation of fade.

If we want to have an animation where the element is very small in the beginning and then scales up to its actual size, we'd use the following syntax:

:: animate: (1.0; scale; bigger)
# I am a headline that scales in

Note that we added an additional parameter which defines the direction of scale. If you want the element to start in very big and then scale down, you'd write

:: animate: (1.0; scale; smaller)
# I am a headline that scales in

Overview

Here's a table of all the possible animations and their options for the animate key:

Key Options Description
off / No animation
fade / Fade in
move left / right / top / bottom Move into the slide
scale bigger / smaller Scale up or down into the slide
fall / Fall into the slide from above

Animation Video

And here's a short video that shows all the animations seen above: