Overview

Rive's interface only shows what is needed, when you need it. The interface is divided into a few main panels, described below.

Toolbar

The Toolbar displays the tools you have available to manipulate and create items on the stage. In addition to these tools, the toolbar houses a variety of options to allow you to customize the look of your file, set your main artboard, and export or share your file.

Toolbar

Access design and animation tools from the Rive Editor toolbar.

Hierarchy

All the objects, assets, controls, and animations that make up your file appear in the Hierarchy.

Hierarchy

The Hierarchy is a tree view, which shows both the parent-child relationships between objects on the stage as well as the order in which they are rendered. Learn about the Hierarchy by either watching the video or reading more below.

Inspector

The Inspector allows you to adjust the properties for the currently selected object.

Inspector

An object's editable properties can be found in the Inspector. The Inspector changes dynamically depending on your selected object and where you are in the editor.

Stage

The stage refers to the central area between the toolbar, the hierarchy, and the inspector. Here you can create the artboards that are the foundations of your designs and animations within Rive.

Stage

The Stage is an infinite canvas where you can place artboards containing all your graphics.

Timeline

The Timeline surfaces from the bottom of the screen upon entering animate mode. Here you can create new animations, access playback controls, and settings, and set keyframes for object parameters. Select an animation from the left-hand list to switch between the respective timelines.

Timeline

The Rive interface displays a timeline with playback controls and options for the current animation in Animate mode. A list of all animations is displayed to the left of the Timeline. Keep in mind that these are animations for the currently active artboard.

State Machine graph

When a state machine is selected, the Timeline is replaced by a graph.

State Machine

State Machines are a visual way to connect animations together and define the logic that drives the transitions.

Quick Links

Toolbar