Uniwind announcement cover

Hello, React Native developers! 🎃

It’s been an incredible 3.5 months. Hubert Bieszczad and I have been working hard to create a brand new product for cross-platform styling. Building on the knowledge we gained from Unistyles, we set out to build new Tailwind bindings that deliver the performance and stability the community deserves.

Today, I’m thrilled to announce the first stable release of Uniwind! 🎉

If you missed my official announcement at Callstack’s React Universe Conf, you can watch the full presentation here:

The className story: A cross-platform bridge

We still believe that StyleSheet is a fantastic way to build mobile apps. However, the need to share styles seamlessly across all platforms: Web, Android, and iOS is undeniable. While StyleSheet often requires you to write extra web styles, className opens a new, unified path for true cross-platform development.

This is where Tailwind comes in. It’s already super popular and powerful tool in web development, and we believe bringing it to your mobile apps is incredibly beneficial, especially when you don’t have to sacrifice performance to do so.

What about Nativewind?

Nativewind is a significant and successful project that has paved the way for styling in React Native. Uniwind is highly inspired by this work, and without it, we wouldn’t be here.

At the same time, we believe the community needs more. Startups and large companies want to depend on stable, well-supported solutions with constant development and rapid bug fixes. We encourage you to try Uniwind and see the difference. It’s 2.5x faster than Nativewind right out of the box.

If you want to give it a shot, check out our Migration Guide from Nativewind.

A CSS Parser That Goes Beyond Tailwind

Uniwind ships with a custom, high-performance CSS parser that not only understands the latest Tailwind 4 syntax but also parses your regular CSS files:

.button {
    width: 100%;
    height: 48px;
    background-image: linear-gradient(to right, #e84444, #9160ec);
    justify-content: center;
    align-items: center;
    border-radius: 24px;
}
<View className="flex-1 justify-center items-center p-4 bg-gray-300">
    <Pressable className="button">
        <Text className="text-white font-bold text-xl">
            Uniwind is awesome!
        </Text>
    </Pressable>
</View>
CSS Parser

This feature opens up entirely new styling patterns for React Native. We are awaiting your feedback so we can continue to improve it and support new patterns as they emerge in the community.

Effortless Multi Theme Support

Uniwind delivers one of the easiest setups for theming. You can use the default light and dark modes or register any number of custom defined themes. To add a new theme, simply register it in the metro plugin:

metro.config.js
module.exports = withUniwindConfig(appConfig, {
  cssEntryFile: './src/global.css',
  extraThemes: ['vandetta']
});

Then, create a new @variant block for your theme in your global.css file. It’s that simple.

@import 'tailwindcss';
@import 'uniwind';

@layer theme {
  :root {
    @variant dark {
      # your dark theme variables
    }

    @variant light {
      # your light theme variables
    }

    @variant vandetta {
      --color-background: #1e1b4b;
      --color-foreground: #fef3c7;
      --color-primary: #fbbf24;
      --color-card: #312e81;
      --color-border: #4c1d95;
    }
  }
}
<View className="bg-background flex-1" />

bg-background will dynamically change based on the current theme!

Automatic React Native Bindings

We made sure to include mappings for every component exported from React Native. This means wherever you previously used the style prop, you can now use className.

For other styling props (like the color prop on Button), we automatically expose a suffixed prop: colorClassName. Remember to use accent- prefixed colors for these non-style properties, as mentioned in our components documentation.

<Button colorClassName="accent-primary" />

As much as I would love to describe every feature here, I encourage everyone to look at our brand-new, shiny documentation. We described everything from monorepo setup and metro configs to every CSS function and hook available. Please take a look and explore it!

First UI Kit 🎨

HeroUI Native

We are also happy to announce a collaboration with HeroUI! You can use the first beta version of Hero UI Native today. The HeroUI team trusted us, and we spent the last few weeks ensuring Uniwind covers every case their components require.

This collaboration also confirms that migrating from Nativewind is not tedious and brings immediate, tangible benefits. We can’t wait to see your apps built with Uniwind and HeroUI!

Install Hero UI Native now.

Coming Soon: Uniwind Pro

It’s time for Pro!

More than 1,500 developers have joined our waitlist. With the stable release of Uniwind, we can now focus on the Pro version.

It should be available later this month with all the goodies, including a powerful 2nd gen. Unsityles C++ engine designed to eliminate re-renders and translation layer that covers className based animation powered by Reanimated. We can’t wait to release the first beta. If you’re waiting for it, make sure you’ve left your email at uniwind.dev.

The Future of Unistyles

You might be asking: what about Unistyles?

I’m happy to announce that we will soon begin work on Unistyles 4.0! We already have new features in mind. Based on our development of Uniwind, we see clear paths for improvement. Our new goal is to bring Unistyles even closer to native StyleSheet performance, with an easier Babel setup, better web support, and the most requested feature of all: Expo Go support!

Summary

Thank you all for your constant feedback over the past few months. Your input allows us to move quickly and help shape a new standard of quality for React Native styling.

We are sure you’re going to love Uniwind. Please give us a star ⭐ on GitHub, try it out, and enjoy building your cross-platform Tailwind apps!

Do you want to support me even more?

github-mona

Sponsor me on Github

kofi

Buy me a coffee

x-twitter

Share it on Twitter

Jacek Pudysz | Copyright © 2025 | All rights reserved

Built with Astro 🚀