Introduction
Tamagui makes styling React easy and fast on web, Android, and iOS. It focuses on platform-native output, with an optional optimizing compiler that significantly improves your app or site performance.
Tamagui is three things:
@tamagui/coreis a style library that expands on the React Native style API with many features from CSS - all without any external dependency except for React.@tamagui/staticis an optimizing compiler that significantly improves performance by hoisting objects and CSS at build-time, leaving behind flatter React trees.tamaguiis a large universal component kit in styled and unstyled forms.
Quick start
Choose from a few starters:
Install
Set up an app.
Highlights
Core only has one dependency - React - but supports the full React Native View and Text API, a superset of the React Native Style API, styled(), powerful hooks, and the typed design system helpers in ~28Kb on web.
A smart, partial-evaluating compiler gives 0-runtime performance with the ergonomics of writing your code however you want - even inline, logic-filled code is optimized.
Every feature works at runtime and compile-time, so none of the usual limits of 0-runtime libraries, while optionally getting the same great performance.
useTheme and useMedia hooks with signal-like granularity and dirty tracking.
Unstyled and styled versions of all components.
Community
We're excited to see the community adopt Tamagui, raise issues, and provide feedback. Whether it's a feature request, bug report, or a project to showcase, please get involved!
Credits
A big thanks to:
- Stitches for the variants pattern.
- JSXStyle for providing the original version of the compiler.
- Modulz for Radix of which we've adopted many APIs, and for the initial structure for this website.
- Moti for the foundation of the reanimated driver.
- Framer Motion for the AnimatePresence functionality.
Next
Installation