React Native
React native runtime for Rive

Overview

This guide documents how to get started using the React Native runtime library. Rive runtime libraries are open-source. The source is available in its GitHub repository. This library contains an API for React Native apps to easily integrate Rive assets.
The minimum iOS target is 14.0

Getting Started

Follow the steps below for a quick start on integrating Rive into your React Native app.

1. Install the dependency

1
npm install rive-react-native
2
# or for Yarn
3
yarn add rive-react-native
Copied!

2. Pod Install

cd inside the ios folder and run pod install (if deploying to iOS)

3. Add the Rive component

App.js
1
import Rive from 'rive-react-native';
2
3
function App() {
4
return <Rive
5
url="https://cdn.rive.app/animations/vehicles.riv"
6
style={{width: 400, height: 400}}
7
/>;
8
}
Copied!
See subsequent runtime pages to learn how to control animation playback, state machines, and more.

Resources