Skip to main content
React Native Skia brings the Skia Graphics Library to React Native. Skia serves as the graphics engine for Google Chrome and Chrome OS, Android, Flutter, Mozilla Firefox, Firefox OS, and many other products.

​
Version Compatibility

Required versions:
  • react-native@>=0.79 and react@>=19
  • iOS 14 or above
  • Android API level 21 or above
  • For video support: Android API level 26 or above
For react-native@<=0.78 and react@<=18, use @shopify/react-native-skia version 1.12.4 or below. Supported platforms: iOS, Android, tvOS, macOS, macOS Catalyst, and Web.

​
Installation

Install the package using your preferred package manager: 
yarn add @shopify/react-native-skia
# or
npm install @shopify/react-native-skia
The Skia prebuilt binaries are included as npm dependencies and are automatically resolved by the native build systems. No postinstall script is needed.

​
Using Expo

Expo provides a with-skia template to quickly create a new project: 
yarn create expo-app my-app -e with-skia
# or
npx create-expo-app my-app -e with-skia

​
Bundle Size

Below is the app size increase when adding React Native Skia to your project:
iOSAndroidWeb
6 MB4 MB2.9 MB

​
iOS Setup

Run pod install in the ios/ directory: 
cd ios && pod install

​
Android Setup

You will need Android NDK installed. If you have Android Studio installed, make sure $ANDROID_NDK is available: 
export ANDROID_NDK=/Users/username/Library/Android/sdk/ndk/<version>
If the NDK is not installed, install it via Android Studio:
  1. Go to File > Project Structure
  2. Select SDK Location
  3. Download the NDK if needed

​
Proguard

If you’re using Proguard, add this rule to proguard-rules.pro: 
-keep class com.shopify.reactnative.skia.** { *; }

​
Troubleshooting

For error CMake ‘X.X.X’ was not found:
  1. Open Tools > SDK Manager
  2. Switch to SDK Tools tab
  3. Find CMake and click Show Package Details
  4. Download the compatible version and apply

​
Web Support

To use React Native Skia in the browser, see Web Support.

​
TV Support

Starting from version 1.9.0, React Native Skia supports TV devices using React Native TVOS. Both Android TV and Apple TV are supported.
Not all features have been tested on TV devices. Please report any issues you encounter.

​
Debugging

We recommend using React Native DevTools to debug your JS code. Alternatively, you can use:

​
Testing with Jest

React Native Skia test mocks use a web implementation that depends on loading CanvasKit. Add to jest.config.js: 
module.exports = {
  transformIgnorePatterns: [
    "node_modules/(?!(react-native|react-native.*|@react-native.*|@?react-navigation.*|@shopify/react-native-skia)/)"
  ],
  testEnvironment: "@shopify/react-native-skia/jestEnv.js",
  setupFilesAfterEnv: [
    "@shopify/react-native-skia/jestSetup.js",
  ],
};

​
Playground

Explore example projects in the React Native Skia repository. You’ll need to build Skia locally first.

Build docs developers (and LLMs) love

Get started for freeTalk to us