Add Images In Your Content and as Backgrounds

There are two kinds of images you can use in your presentations:

  • Inline Images
  • Slide Backgrounds

Inline Images

Add inline images by adding a slide link to your text:

![Alt Text](Image URL)

The image URL can be

  • Relative to the presentation (./images/some_image.jpg)—This works as soon as the presentation was saved to disk for the first time.
  • From the built-in assets (assets:/images/dragonfly.jpg)—But there are only a few example images available there.

Slide Backgrounds

You can set a slide background by starting the slide with a horizontal rule (---) and adding a "background" option:

---{background=./images/some_image.jpg}

As with the inline images above, the image URL can be either relative to the presentation or the image can come from the built-in assets.

Background Positioning

By default, the background covers the whole slide. To change this behavior, use the background-position, background-width and background-height options:

  • background-position must contain two values separated by a comma. The first can be top, center or bottom, the second value can be left, center or right. e.g. background-position=top,left
  • background-height is a single number where 100 is the height of the slide. e.g. background-height=70 or the value "fit"
  • background-width is a single number where 100 is the width of the slide. e.g. background-width=70 or the value "fit"

For example, to position the background image on the right and make it occupy half of the slide, use

---{background=./images/some_image.jpg;background-position=center,right;background-width=50}

If you use the value "fit" as a background size (e.g. background-width=fit), the background will cover the whole slide in that dimension.