letterbox slides

quarto-revealjs-letterbox

.image-right

We can use the .image-right and .image-left classes to insert images in the background

These images will be placed behind most other content

.image-left

It is therefore recommened that you use multiple columns to only have text on the background area

background images

Setting background colors

you can set your background as you normally would

Video Slide Title

This slides’s background video will play in a loop with audio muted.

Slide Title

Further Modifying theme

If you want to modify theme, you can specify the .scss my modifying the yaml to look like this

format: 
  letterbox-revealjs:
    theme: [default, style.scss]

Modifying letterbox background

The background colors can be with with, where #444444 represents the new background color and #222222 represents the color of the shadow

.quarto-light {
  background-color: #444444;
}

.quarto-dark {
  background-color: #444444;
}

.slides {
  box-shadow: #222222 0px 0px 30px 0px;
}

Quarto

Quarto enables you to weave together content and executable code into a finished presentation. To learn more about Quarto presentations see https://quarto.org/docs/presentations/.

Bullets

When you click the Render button a document will be generated that includes:

  • Content authored with markdown
  • Output from executable code

Code

When you click the Render button a presentation will be generated that includes both content and the output of embedded code. You can embed code like this:

[1] 2