React Native Nitro Gradients

High-performance gradient components for React Native, built with Nitro Modules ⚡

This project was bootstrapped from react-native-nitro-image by Marc Rousavy.

[!WARNING] 🚧 Under Active Development

This library is currently in early development and not recommended for production use

Features

• 🎨 Three gradient types - Linear, Radial, and Sweep gradients
• 🎭 First-class Reanimated support - Smooth 60fps animations with shared values

Installation

npm install react-native-nitro-gradients
npm install react-native-nitro-modules react-native-reanimated react-native-worklets
cd ios && pod install

Requires React Native 0.78.0+ with New Architecture enabled

Quick Example

import { LinearGradient } from 'react-native-nitro-gradients';

function App() {
  return (
    <LinearGradient
      colors={['#667eea', '#764ba2']}
      start={{ x: 0, y: 0 }}
      end={{ x: 1, y: 1 }}
      style={{ width: 200, height: 200 }}
    />
  );
}

Documentation

📖 Read the full documentation

• Installation Guide
• Linear Gradient
• Radial Gradient
• Sweep Gradient
• Animations with Reanimated

License

MIT