react-native-skia
High-performance React Native Graphics using Skia
A Shopify-maintained library that brings the Skia 2D graphics engine, used inside Chrome and Android, to React Native, letting you draw custom shapes, gradients, and visual effects in mobile apps on iOS and Android.
React Native Skia is a library, maintained by Shopify, that brings high-performance 2D graphics drawing capabilities to React Native mobile apps. It connects the Skia graphics library to React Native, letting developers draw shapes, gradients, images, and other visual content directly on screen with speed that matches what you would expect from native platform code.
Skia is the same graphics engine used internally by Google Chrome, Android, Flutter, and Mozilla Firefox. This library packages that engine so React Native apps can use it. If you are building a mobile app with React Native and need custom visual rendering beyond what standard UI components provide, this library is a way to do that without writing platform-specific code separately for iOS and Android.
The README is brief and points to external documentation for installation and usage details. The library is available on npm under the @shopify/react-native-skia package name. An experimental alternative rendering backend called Graphite is available in a preview release channel via yarn, though the README explicitly marks it as not ready for production and notes it requires Android API Level 26 or higher.
The project is open source and contributions are described in a separate contributing document inside the repository.
Where it fits
- Draw custom animated shapes and gradients in a React Native mobile app without writing separate iOS and Android native code.
- Build a freehand drawing or signature capture canvas in a React Native app using Skia path rendering.
- Render high-performance visual effects like blurs, shadows, and color filters directly in a React Native screen.
- Add a custom progress ring or animated chart to a React Native app using Skia's drawing primitives.