CSS for Presentation Slides

On this post, please share any CSS code which you used to enhance/modify the SLIDES feature in Obsidian.

This changes the font size of all elements in presentation mode.

.reveal {
  font-size: 1em;
}

This changes the font size of tables.

.reveal table {
  font-size: 0.2em;
}

This changes the size and font colour of the headings.

.reveal h1 {
  font-size: 5em;
  color: #B22222;
}
.reveal h2 {
  font-size: 5em;
  color: #B22222;
}
.reveal h3 {
  font-size: 4em;
  color: #B22222;
}
.reveal h4 {
  font-size: 3em;
  color: #B22222;
}
.reveal h5 {
  font-size: 2em;
  color: #B22222;
}
.reveal h6 {
  font-size: 1.5em;
  color: #B22222;
}

This changes the font size of the paragraphs, colours them black and justifies them.

.reveal p {
    font-size: 1em;
    color: black;
    text-align: justify;
}
7 Likes

Great! I just need now to scale the images to the slide. There is a command in CSS called contain. How I can write a snippet to make it work?