Overview

React Native Zephyr is a TailwindCSS-inspired styling library for React Native.

TailwindCSS is a brilliant library, but it's built for CSS and the web browser – and these are tools that are not available in React Native projects. This project aims to borrow some of the core ideas of TailwindCSS and implement them in the context of React Native applications.

React Native Zephyr, out of the box, provides:

a thorough set of built-in styling utilities (spacing, colors, typography, etc.);
an extendable and overridable theming system;
type-safety for speedy and confident development;
dark-mode support out of the box;
clsx-like syntax for applying dynamic style classes.

Head over to the docs to learn more.

Installation

In your React Native or Expo project, install react-native-zephyr using your favorite package registry tool such as npm, yarn, or pnpm.

npm install react-native-zephyr

yarn add react-native-zephyr

pnpm add react-native-zephyr

There is no further installation as react-native-zephyr is a pure JS library with no native dependencies. See our Quick Start guide to get started with configuration.