Artboards

This article is out of date! Find the new version here.

Artboards are the foundation of your composition across both design and animate mode. They act as the root of every hierarchy and allow you to define the dimensions and background color of a scene. You can create an infinite amount of artboards on the Stage, but each Rive file has at least one artboard.

To learn more about Artboards, watch our video on Artboards or read more below.

Active artboard

The active artboard is represented with a dot next to its name on the stage. You can activate an artboard by clicking on it or any of its children within the stage. Note that sections of the editor will only surface content associated with the active artboard. For instance, only the active artboard's hierarchy is displayed in the tree. Similarly, only animations referenced to the active artboard will surface within the timeline.

Default State Machine

The default state machine is the state machine that will be played when using the play button in the Toolbar. In addition to setting the default state machine, this also sets the default artboard that a developer will see when using this file outside of Rive.

To change the default state machine, use the dropdown to select the one you want to use.

You can quickly play the selected state machine from Design Mode by holding shift and hitting the space bar.

Creating an artboard

Before creating any graphics, you'll first need to create an artboard. When you create a new file, you'll be prompted to create your first artboard.

To create additional artboards, select the Artboard tool from the Artboard menu within the toolbar, or use the A shortcut. Click and drag to define the bounds. You can always adjust the size and position by selecting the artboard in the Hierarchy to surface its properties in the Inspector.

Artboard properties

Every artboard has various properties that can be changed in the Inspector. Some of the attributes that can be changed include an artboard's position on the Stage, its size, fill color, and the origin point.