Rive for Game UI

Rive for Game UI

Rive for Game UI

Features

An end-to-end pipeline for interactive graphics

Rive's editor, file format, and runtimes work seamlessly together, making it easy for designers and developers to create captivating interactive moments. This end-to-end pipeline guarantees that what you build in Rive looks and behaves exactly the same in your websites, apps, and games.

Changelog

State Machine

Built for interactivity

Empower designers to drive functionality that ships in the final product. The State Machine bridges the gap between design and development, making iteration a breeze.

Transitions

Connect animations with transitions and define their conditions.

Transitions

Connect animations with transitions and define their conditions.

Transitions

Connect animations with transitions and define their conditions.

Listeners

Make graphics respond to hovers, clicks, taps, and more.

Listeners

Make graphics respond to hovers, clicks, taps, and more.

Listeners

Make graphics respond to hovers, clicks, taps, and more.

Inputs

Inputs are the contract between design and engineering.

Inputs

Inputs are the contract between design and engineering.

Inputs

Inputs are the contract between design and engineering.

Blend States

Interactively layer and blend animations together.

Blend States

Interactively layer and blend animations together.

Blend States

Interactively layer and blend animations together.

State Machine Layers

Create concurrent functionality with state machine layers.

State Machine Layers

Create concurrent functionality with state machine layers.

State Machine Layers

Create concurrent functionality with state machine layers.

Text

Animatable, variable, dynamic text for runtime, with full support for any language.

Text

Animatable, variable, dynamic text for runtime, with full support for any language.

Text

Animatable, variable, dynamic text for runtime, with full support for any language.

Events

Let your runtime code know something meaningful happened in your Rive file.

Events

Let your runtime code know something meaningful happened in your Rive file.

Events

Let your runtime code know something meaningful happened in your Rive file.

Dynamic Assets

Dynamically load and control any asset (fonts, images, and audio) at runtime.

Dynamic Assets

Dynamically load and control any asset (fonts, images, and audio) at runtime.

Dynamic Assets

Dynamically load and control any asset (fonts, images, and audio) at runtime.

Audio

Add user-triggered sound effects to your interactive Rive graphics.

Audio

Add user-triggered sound effects to your interactive Rive graphics.

Audio

Add user-triggered sound effects to your interactive Rive graphics.

Animate anything

Rive is built for fast and performant real-time animation. Everything in the platform behaves more like a game engine than a traditional design tool.

Timeline

Animate any property with Rive's comprehensive timeline.

Timeline

Animate any property with Rive's comprehensive timeline.

Timeline

Animate any property with Rive's comprehensive timeline.

Interpolation

Create natural looking motion with interpolation (easing).

Interpolation

Create natural looking motion with interpolation (easing).

Interpolation

Create natural looking motion with interpolation (easing).

Animation Mixing

Mixing animations is a core concept of interactivity.

Animation Mixing

Mixing animations is a core concept of interactivity.

Animation Mixing

Mixing animations is a core concept of interactivity.

Clipping

Cut out parts of your graphics using clipping.

Clipping

Cut out parts of your graphics using clipping.

Clipping

Cut out parts of your graphics using clipping.

Skeletal Animation

Use bones to animate characters and other objects.

Skeletal Animation

Use bones to animate characters and other objects.

Skeletal Animation

Use bones to animate characters and other objects.

Trim Paths

Animate only a portion of the stroke on a vector shape.

Trim Paths

Animate only a portion of the stroke on a vector shape.

Trim Paths

Animate only a portion of the stroke on a vector shape.

Meshes

A powerful way to add natural and organic deformations.

Meshes

A powerful way to add natural and organic deformations.

Meshes

A powerful way to add natural and organic deformations.

Binding

Connect meshes to bones with Rive's weighting system.

Binding

Connect meshes to bones with Rive's weighting system.

Binding

Connect meshes to bones with Rive's weighting system.

Constraints

Control the properties of one object through another.

Constraints

Control the properties of one object through another.

Constraints

Control the properties of one object through another.

Inverse Kinematics

Set up poses without having to manipulate bones individually.

Inverse Kinematics

Set up poses without having to manipulate bones individually.

Inverse Kinematics

Set up poses without having to manipulate bones individually.

Draw Order

Animate the draw order without having to create duplicate objects.

Draw Order

Animate the draw order without having to create duplicate objects.

Draw Order

Animate the draw order without having to create duplicate objects.

Nested Artboards

Speed up your workflow by reusing common animations.

Nested Artboards

Speed up your workflow by reusing common animations.

Nested Artboards

Speed up your workflow by reusing common animations.

Solos

Create skins, toggle entire hierarchies, or create frame-by-frame effects.

Solos

Create skins, toggle entire hierarchies, or create frame-by-frame effects.

Solos

Create skins, toggle entire hierarchies, or create frame-by-frame effects.

Vector Graphics

Draw vector shapes directly in Rive or import pre-made SVGs.

Vector Graphics

Draw vector shapes directly in Rive or import pre-made SVGs.

Vector Graphics

Draw vector shapes directly in Rive or import pre-made SVGs.

Raster Graphics

Import single PNG, JPEG, and WebP images, or PSDs to preserve layers.

Raster Graphics

Import single PNG, JPEG, and WebP images, or PSDs to preserve layers.

Raster Graphics

Import single PNG, JPEG, and WebP images, or PSDs to preserve layers.

Joysticks

Joysticks make it easy to create rich animations with simple controls.

Joysticks

Joysticks make it easy to create rich animations with simple controls.

Joysticks

Joysticks make it easy to create rich animations with simple controls.

Follow Path

Easily animate and orient objects along a path with this constraint.

Follow Path

Easily animate and orient objects along a path with this constraint.

Follow Path

Easily animate and orient objects along a path with this constraint.

Export anywhere

Easily embed interactive animations, manipulate everything with code, or render traditional formats. No complicated handoff, redlines, or documentation required.

Share Links

Present your files to clients or embed them into various platforms with a simple link.

Share Links

Present your files to clients or embed them into various platforms with a simple link.

Share Links

Present your files to clients or embed them into various platforms with a simple link.

Cloud Renderer

Continue working while we generate your videos, GIFs, and PNG sequences.

Cloud Renderer

Continue working while we generate your videos, GIFs, and PNG sequences.

Cloud Renderer

Continue working while we generate your videos, GIFs, and PNG sequences.

Framer

Easily add your files to a Framer site and control them without code.

Framer

Easily add your files to a Framer site and control them without code.

Framer

Easily add your files to a Framer site and control them without code.

Unity

Render Rive interactive graphics and UI in Unity.

Unity

Render Rive interactive graphics and UI in Unity.

Unity

Render Rive interactive graphics and UI in Unity.

Unreal

Render Rive interactive graphics and UI in Unreal.

Unreal

Render Rive interactive graphics and UI in Unreal.

Unreal

Render Rive interactive graphics and UI in Unreal.

Bevy

Render Rive interactive graphics and UI in Bevy.

Bevy

Render Rive interactive graphics and UI in Bevy.

Bevy

Render Rive interactive graphics and UI in Bevy.

iOS

An open-source library to run Rive in iOS apps and manipulate your graphics with code.

iOS

An open-source library to run Rive in iOS apps and manipulate your graphics with code.

iOS

An open-source library to run Rive in iOS apps and manipulate your graphics with code.

macOS

An open-source library to run Rive in macOS apps and manipulate your graphics with code.

macOS

An open-source library to run Rive in macOS apps and manipulate your graphics with code.

macOS

An open-source library to run Rive in macOS apps and manipulate your graphics with code.

Web (JS)

An open-source library to run Rive on the web and manipulate your graphics with code.

Web (JS)

An open-source library to run Rive on the web and manipulate your graphics with code.

Web (JS)

An open-source library to run Rive on the web and manipulate your graphics with code.

Android

An open-source library to run Rive in Android apps and manipulate your graphics with code.

Android

An open-source library to run Rive in Android apps and manipulate your graphics with code.

Android

An open-source library to run Rive in Android apps and manipulate your graphics with code.

Windows

An open-source library to run Rive in Windows apps and manipulate your graphics with code.

Windows

An open-source library to run Rive in Windows apps and manipulate your graphics with code.

Windows

An open-source library to run Rive in Windows apps and manipulate your graphics with code.

React

An open-source library to run Rive in React apps and manipulate your graphics with code.

React

An open-source library to run Rive in React apps and manipulate your graphics with code.

React

An open-source library to run Rive in React apps and manipulate your graphics with code.

React Native

An open-source library to run Rive in React Native apps and manipulate your graphics with code.

React Native

An open-source library to run Rive in React Native apps and manipulate your graphics with code.

React Native

An open-source library to run Rive in React Native apps and manipulate your graphics with code.

Rust

An open-source library to run Rive in Rust apps and manipulate your graphics with code.

Rust

An open-source library to run Rive in Rust apps and manipulate your graphics with code.

Rust

An open-source library to run Rive in Rust apps and manipulate your graphics with code.

Flutter

An open-source library to run Rive in Flutter apps and manipulate your graphics with code.

Flutter

An open-source library to run Rive in Flutter apps and manipulate your graphics with code.

Flutter

An open-source library to run Rive in Flutter apps and manipulate your graphics with code.

C++

An open-source library to run Rive in C++ apps and manipulate your graphics with code.

C++

An open-source library to run Rive in C++ apps and manipulate your graphics with code.

C++

An open-source library to run Rive in C++ apps and manipulate your graphics with code.

GameKit for Flutter

Create rich 2D games with insanely fast vector graphics thanks to the Rive Renderer.

GameKit for Flutter

Create rich 2D games with insanely fast vector graphics thanks to the Rive Renderer.

GameKit for Flutter

Create rich 2D games with insanely fast vector graphics thanks to the Rive Renderer.

Latest updates

Learn more about all our new features, fixes, and improvements.

Changelog

Start building beautiful interactive graphics

Get Started

Join our newsletter

Get all the latest Rive news delivered to your inbox.