v0.2.0

System

Matches Tailwind 4.3.3

Tailwind CSS for React Native.

Write className the way you would on the web. AstraWind resolves every class to native styles at runtime, with Tailwind's own theme values. No build step, no approximations.

Get started

npx expo install @astrawind/css

Hello

Save

save-card.tsx

<View className="flex-row items-center gap-3 rounded-xl bg-white p-4 shadow-md dark:bg-zinc-900">
  <Text className="text-lg font-semibold text-zinc-900 dark:text-white">Hello</Text>
  <Pressable className="ml-auto rounded-lg bg-indigo-600 px-4 py-2 transition active:scale-95 active:bg-indigo-700">
    <Text className="font-medium text-white">Save</Text>
  </Pressable>
</View>

Every Tailwind class resolves

The test suite runs every class and variant Tailwind generates, 23,000+, and fails if any is unknown. Classes with no native equivalent are accepted as deliberate no-ops.

No build step

No Babel plugin or CSS compilation: classes are parsed when they render, and the results are cached.

CSS semantics, not approximations

Custom properties with var(), calc(), inheriting text styles, oklch() colors, group-*, peer-* and has-*, container queries and transitions.

Tailwind's own theme

The same spacing, colors, radii, shadows and type scale as the web, generated from the installed Tailwind release.

Every utility, documented for native.

184 utility pages list each class with its CSS and what it becomes on React Native.

Browse the docs