Library / SDK
Shopify/react-native-skia avatar
Shopify/react-native-skia

React Native Skia v3: Graphite on Metal and Vulkan, a renamed npm package, and a v2 line that keeps Android TV

High-performance React Native Graphics using Skia

8,780 stars680 forksTypeScriptMIT

At a glance

What is it?
React Native Skia brings Google's Skia 2D graphics library to React Native. Version 3 moves rendering to Skia's Graphite backend and a multi-threaded architecture, and publishes under a new npm name, while the older Ganesh-based v2 line stays maintained for apps that need it.
Who is it for?
React Native Skia v3 is the choice for React Native apps on iOS, Android, macOS, Mac Catalyst, tvOS or Web that want Skia drawing on Graphite, and for teams that plan to combine Skia with React Native WebGPU or three.js. Apps that target Android TV should stay on v2, the only line that lists it.
Can I use it commercially?
Yes. MIT is a permissive licence: you can use, modify and sell software built on it, as long as you keep its copyright and licence notices.
Is it still maintained?
Yes. The repository received new commits within the last day.
What is it written in?
Mainly TypeScript, according to GitHub's language statistics.

Answers come from the project's GitHub data, last synced on November 14, 2026, and from our analysis. They are not legal advice.

From daily snapshots

Star history

  • Shopify/react-native-skia8,780 ★ · +175
Star history
Repository2026-09-222026-11-14
Shopify/react-native-skia8.6k8.8k

175 Stars in the last 53 days, measured from the daily GitHub snapshot. Compare with other projects

Editorial analysis

Skia, the engine behind Chrome and Flutter, exposed to React Native

Skia is the graphics engine used by Google Chrome and Chrome OS, Android, Flutter, Mozilla Firefox and Firefox OS, among other products. React Native Skia takes that library and makes it available to React Native code, so an app can draw 2D graphics through the same engine those browsers and toolkits rely on, instead of composing native views or SVG elements.

The project is MIT licensed, which answers the question of cost: there is no paid tier attached to the library itself. The repository is written mainly in TypeScript, the default branch is main, and the documentation site is hosted on GitHub Pages. The repository is not archived, the last push landed on 2026-11-01, and the release history is dense: v3.8.1 on 2026-10-27, v3.9.0 on 2026-11-02 and v3.9.1 on 2026-11-03. Point releases within a day of each other mean you should pin a version in package.json rather than accept whatever a caret range resolves to on the next install.

The npm name changed from @shopify/react-native-skia to react-native-skia

The GitHub repository is still filed as Shopify/react-native-skia, but the README now points at wcandillon/react-native-skia for CI, issues and documentation, and the package it tells you to install has no Shopify scope:

sh
yarn add react-native-skia

That is the v3 package. The v2 line is published as `react-native-skia@2`. Code that imports `@shopify/react-native-skia` belongs to the older naming, and the project sends those users to a migration guide on the documentation site rather than treating it as a simple dependency bump.

The practical consequence: search results, blog posts and Stack Overflow answers written for the scoped package will show import paths that no longer match what `yarn add react-native-skia` installs. If you copy an example and the import fails, check the package name before you debug the drawing code. The package.json at the repository root lists William Candillon as author and Christian Falch as a contributor.

Graphite on Metal and Vulkan replaces Ganesh on OpenGL

React Native Skia v3 renders with Graphite, Skia's newer GPU backend. Graphite runs on Metal on Apple platforms and on Vulkan on Android. v2 used Ganesh, Skia's older backend, which runs on OpenGL and Metal. The architecture changed with it: v3 is multi-threaded, v2 is single-threaded.

On Android this is the change that matters most. v3 does not have an OpenGL path; Android rendering goes through Vulkan. If your app has to run on Android devices whose Vulkan support you cannot rely on, v3 is not a drop-in upgrade, and v2 with Ganesh on OpenGL remains the line that covers that case. On Apple platforms both versions use Metal, so the backend swap is less visible there, but the move from a single-threaded to a multi-threaded architecture applies on every platform.

The two lines also live on different branches: v3 on `main`, v2 on `2.x`, each with its own documentation site, so make sure the docs page you read matches the major version in your lockfile.

v3 drops Android TV from the supported platforms

The platform lists for the two major versions are not identical. v3 supports iOS, Android, macOS, Mac Catalyst, tvOS and Web. v2 supports all of those plus Android TV.

For most apps this changes nothing. For a team shipping a React Native app to Android TV, it means upgrading to v3 removes a platform you already ship to. The answer, for now, is to stay on `react-native-skia@2`. v2 is still maintained, so this is not a choice between a current release and an abandoned one, but you do give up the Graphite backend, the multi-threaded architecture and the WebGPU interop that v3 adds.

Apple TV users are in a different position: tvOS appears in both lists, so an Apple TV target does not by itself force you to stay on v2. Check each of your targets against the v3 list before planning the upgrade, rather than assuming that every platform v2 reached carries forward.

Sharing one GPU device with React Native WebGPU and three.js

Graphite in v3 runs on Dawn, Google's implementation of WebGPU. That detail is what makes the WebGPU integration possible. When React Native WebGPU, a separate package from the same author, is installed alongside React Native Skia, the two share the same GPU device and can exchange textures without any copy. The same arrangement works with three.js.

In practice, this lets a single screen mix Skia 2D drawing with WebGPU or three.js 3D rendering and pass textures between them without the cost of reading pixels back and uploading them again. It is a v3 feature: v2 renders through Ganesh and is not built on Dawn, so an app pinned to v2 for Android TV or OpenGL reasons does not get this path. The WebGPU section of the documentation site covers the setup, and the repository root pins `@webgpu/types` to `^0.1.69` through a Yarn resolution.

A Yarn 3 and Turborepo monorepo that patches Reanimated 4.6.0

The repository is a monorepo named react-native-skia-monorepo, with workspaces under `packages/*` and `apps/*`. It pins Yarn through `"packageManager": "[email protected]"` and drives builds through Turborepo: root scripts such as `lint`, `tsc`, `test`, `build`, `build:android`, `build:ios`, `build:macos` and `pod:install` each call `turbo run` on the matching task. Web tests run Playwright with the config at `apps/example/playwright.config.ts`. The library itself lives in `packages/skia`, where CONTRIBUTING.md covers development, building and testing.

One line in the root package.json deserves attention if you pair Skia with animations. The resolutions block applies a local patch to `[email protected]`, stored under `.yarn/patches`. That patch applies inside this repository's own example apps. Your app does not inherit it from the npm package, so if your project uses the same Reanimated version and you see behaviour that differs from the example app, the patch is one difference to rule out. The repository also contains `externals/`, a `.gitmodules` file and an `spm-example/` directory.

Installation is one command plus an external guide

The getting started section of the README is a single command, `yarn add react-native-skia`, followed by a link to the installation instructions on the documentation site. Platform setup lives on that site rather than on the repository front page, so plan to read the installation page for your platform before assuming the yarn command is the whole job.

The same applies to topics people search for, such as charts, blur, video, lists and drag and drop. The README does not walk through any of them; it gives the package, the backend comparison and the WebGPU interop, and leaves the drawing API to the full documentation. If you are evaluating the library against SVG or against writing animations with Reanimated alone, the decision rests on the docs and the example app under `apps/`, not on the README.

Editorial conclusion

React Native Skia v3 is the choice for React Native apps on iOS, Android, macOS, Mac Catalyst, tvOS or Web that want Skia drawing on Graphite, and for teams that plan to combine Skia with React Native WebGPU or three.js. Apps that target Android TV should stay on v2, the only line that lists it. Before installing, check which package name your project already uses: code written against @shopify/react-native-skia has to go through the migration guide rather than a version bump.

Frequently asked questions

how to install react native skia

Run yarn add react-native-skia for v3, then follow the installation instructions on the documentation site for your platform. The v2 line is published as react-native-skia@2.

What is skia used for?

Skia is a 2D graphics library that serves as the graphics engine for Google Chrome and Chrome OS, Android, Flutter, Mozilla Firefox and Firefox OS. React Native Skia brings it to React Native apps.

is react native skia free

Yes. React Native Skia is released under the MIT license.

what is shopify react native skia

It is the earlier npm name, @shopify/react-native-skia, of the library now published as react-native-skia. Projects on the scoped package upgrade through the project's migration guide.

Official sources

  1. License: MIT
  2. Project website
  3. README
  4. Releases
  5. Shopify/react-native-skia on GitHub
Add this badge to your README

If you maintain this project, the badge below links readers to this analysis and shows its maintenance status from the daily GitHub snapshot. Paste the markdown into your README; add ?metric=license or ?metric=stars to the image URL for a different field.

Add this badge to your README

markdown
[![Hysen Labs](https://hysenlabs.com/badge/shopify-react-native-skia.svg)](https://hysenlabs.com/projects/shopify-react-native-skia)

Star history chart for your README

markdown
[![Star history](https://hysenlabs.com/chart/shopify-react-native-skia.svg)](https://hysenlabs.com/projects/shopify-react-native-skia)

Was this useful?