Welcome to Slides

Academic


Features


Controls


Code Highlighting

Inline code: variable

Code block:

porridge <span style="color:#f92672">=</span> <span style="color:#e6db74"></span><span style="color:#e6db74">"</span><span style="color:#e6db74">blueberry</span><span style="color:#e6db74">"</span>
<span style="color:#66d9ef">if</span> porridge <span style="color:#f92672">==</span> <span style="color:#e6db74"></span><span style="color:#e6db74">"</span><span style="color:#e6db74">blueberry</span><span style="color:#e6db74">"</span>:
    <span style="color:#66d9ef">print</span>(<span style="color:#e6db74"></span><span style="color:#e6db74">"</span><span style="color:#e6db74">Eating...</span><span style="color:#e6db74">"</span>)

Math

In-line math: x+y=z

Block math:

f(x)=;2(x+4)(x4)(x+4)(x+1)


Fragments

Make content appear incrementally

{{% fragment %}} One {{% /fragment %}}
{{% fragment %}} **Two** {{% /fragment %}}
{{% fragment %}} Three {{% /fragment %}}

Press Space to play!

One Two Three


A fragment can accept two optional parameters:


Speaker Notes

Add speaker notes to your presentation

Press the S key to view the speaker notes!


Themes



Custom Slide

Customize the slide style and background

{{< slide background-image="/img/boards.jpg" >}}
{{< slide background-color="#0000FF" >}}
{{< slide class="my-style" >}}

Custom CSS Example

Let's make headers navy colored.

Create assets/css/reveal_custom.css with:

.<span style="color:#a6e22e">reveal</span> <span style="color:#f92672">section</span> <span style="color:#f92672">h1</span><span style="color:#f92672">,</span>
.<span style="color:#a6e22e">reveal</span> <span style="color:#f92672">section</span> <span style="color:#f92672">h2</span><span style="color:#f92672">,</span>
.<span style="color:#a6e22e">reveal</span> <span style="color:#f92672">section</span> <span style="color:#f92672">h3</span> {
  <span style="color:#66d9ef">color</span>: <span style="color:#66d9ef">navy</span>;
}

Questions?

Ask

Documentation

Custom SlideCustomize the slide style and background{{< slide background-image="/img/boards.jpg" >}} {{< slide background-color="#0000FF" >}} {{< slide class="my-style" >}} Custom CSS ExampleLet's make headers navy colored.Create assets/css/reveal_custom.css with:.reveal section h1, .reveal section h2, .reveal section h3 { color: navy; } Questions?AskDocumentation