Auto Animate

Auto-Animate Example

This will fade out


    function Example() {
      const [count, setCount] = useState(0);
    }

Auto-Animate Example

This will fade out

This element is unmatched


    function Example() {
      New line!
      const [count, setCount] = useState(0);
    }

Line Height & Letter Spacing


      import React, { useState } from 'react';

      function Example() {
        const [count, setCount] = useState(0);

        return (
          reveal.js.
        );
      }


      function Example() {
        const [count, setCount] = useState(0);

        return (
          <div>
            <p>You clicked {count} times</p>
            <button onClick={() => setCount(count + 1)}>
              Click me
            </button>
          </div>
        );
      }


      function Example() {
        // A comment!
        const [count, setCount] = useState(0);

        return (
          <div>
            <p>You clicked {count} times</p>
            <button onClick={() => setCount(count + 1)}>
              Click me
            </button>
          </div>
        );
      }

Swapping list items

One
Two
Three

Swapping list items

Two
One
Three

Swapping list items

Two
Three
One

SLIDE 1

Animate Anything

SLIDE 2

With Auto Animate

SLIDE 3

With Auto Animate

SLIDE 3

With Auto Animate

data-auto-animate-id="a"

A1

data-auto-animate-id="a"

A1

A2

data-auto-animate-id="b"

B1

data-auto-animate-id="b"

B1

B2

Slide 1
Slide 2
Slide 3
Slide 4