# Nativewind v5

> Nativewind v5 uses Tailwind CSS v4 as a scripting language to create a universal style system for React Native. Built on top of react-native-css, it compiles Tailwind CSS styles into native StyleSheet objects at build time while providing an efficient runtime for conditional styles like hover, focus, media queries, and container queries.

## Overview

- [Overview](https://nativewind.dev/v5)

## Getting Started

- [Editor Setup](https://nativewind.dev/v5/getting-started/editor-setup)
- [Troubleshooting](https://nativewind.dev/v5/getting-started/troubleshooting)
- [Typescript](https://nativewind.dev/v5/getting-started/typescript)
- [Additional Setup Guides](https://nativewind.dev/v5/getting-started/installation/_additional-guides)
- [_install helper](https://nativewind.dev/v5/getting-started/installation/_install)
- [_npm helper](https://nativewind.dev/v5/getting-started/installation/_npm)
- [_tailwind helper](https://nativewind.dev/v5/getting-started/installation/_tailwind)
- [Try it out](https://nativewind.dev/v5/getting-started/installation/_try-it-out)
- [TypeScript Setup](https://nativewind.dev/v5/getting-started/installation/_typescript)
- [Installation](https://nativewind.dev/v5/getting-started/installation/frameworkless)
- [Installation](https://nativewind.dev/v5/getting-started/installation)
- [Installation](https://nativewind.dev/v5/getting-started/installation/nextjs)

## Guides

- [Writing Custom Components](https://nativewind.dev/v5/guides/custom-components)
- [Migrate from v4](https://nativewind.dev/v5/guides/migrate-from-v4)
- [Other Bundlers](https://nativewind.dev/v5/guides/other-bundlers)
- [Themes](https://nativewind.dev/v5/guides/themes)
- [Styling Third-Party Components](https://nativewind.dev/v5/guides/third-party-components)
- [Using with Monorepos](https://nativewind.dev/v5/guides/using-with-monorepos): Learn how to set up Nativewind in monorepo environments like NX

## Core Concepts

- [Dark Mode](https://nativewind.dev/v5/core-concepts/dark-mode)
- [Functions & Directives](https://nativewind.dev/v5/core-concepts/functions-and-directives)
- [Responsive Design](https://nativewind.dev/v5/core-concepts/responsive-design)
- [States & Pseudo-classes](https://nativewind.dev/v5/core-concepts/states)
- [Style Specificity](https://nativewind.dev/v5/core-concepts/style-specificity)
- [Built on Tailwind CSS](https://nativewind.dev/v5/core-concepts/tailwindcss)
- [Units](https://nativewind.dev/v5/core-concepts/units)

## Customization

- [Colors](https://nativewind.dev/v5/customization/colors)
- [Configuration](https://nativewind.dev/v5/customization/configuration)
- [Theme](https://nativewind.dev/v5/customization/theme)

## API

- [cssInterop & remapProps](https://nativewind.dev/v5/api/css-interop)
- [styled](https://nativewind.dev/v5/api/styled)
- [useColorScheme](https://nativewind.dev/v5/api/use-color-scheme)
- [vars() & useUnstableNativeVariable()](https://nativewind.dev/v5/api/vars)
- [withNativewind](https://nativewind.dev/v5/api/with-nativewind)

## Tailwind CSS Utilities

- [_compatibility.mdx](https://nativewind.dev/v5/tailwind/_compatibility)
- [_legend.mdx](https://nativewind.dev/v5/tailwind/_legend)
- [Screen Readers](https://nativewind.dev/v5/tailwind/accessibility/screen-readers)
- [Background Attachment](https://nativewind.dev/v5/tailwind/backgrounds/background-attachment)
- [Background Clip](https://nativewind.dev/v5/tailwind/backgrounds/background-clip)
- [Background Color](https://nativewind.dev/v5/tailwind/backgrounds/background-color)
- [Background Image](https://nativewind.dev/v5/tailwind/backgrounds/background-image)
- [Background Origin](https://nativewind.dev/v5/tailwind/backgrounds/background-origin)
- [Background Position](https://nativewind.dev/v5/tailwind/backgrounds/background-position)
- [Background Repeat](https://nativewind.dev/v5/tailwind/backgrounds/background-repeat)
- [Background Size](https://nativewind.dev/v5/tailwind/backgrounds/background-size)
- [Gradient Color Stops](https://nativewind.dev/v5/tailwind/backgrounds/gradient-color-stops)
- [Border Color](https://nativewind.dev/v5/tailwind/borders/border-color)
- [Border Radius](https://nativewind.dev/v5/tailwind/borders/border-radius)
- [Border Style](https://nativewind.dev/v5/tailwind/borders/border-style)
- [Border Width](https://nativewind.dev/v5/tailwind/borders/border-width)
- [Divide Color](https://nativewind.dev/v5/tailwind/borders/divide-color)
- [Divide Style](https://nativewind.dev/v5/tailwind/borders/divide-style)
- [Divide Width](https://nativewind.dev/v5/tailwind/borders/divide-width)
- [Outline Color](https://nativewind.dev/v5/tailwind/borders/outline-color)
- [Outline Offset](https://nativewind.dev/v5/tailwind/borders/outline-offset)
- [Outline Style](https://nativewind.dev/v5/tailwind/borders/outline-style)
- [Outline Width](https://nativewind.dev/v5/tailwind/borders/outline-width)
- [Ring Color](https://nativewind.dev/v5/tailwind/borders/ring-color)
- [Ring Offset Color](https://nativewind.dev/v5/tailwind/borders/ring-offset-color)
- [Ring Offset Width](https://nativewind.dev/v5/tailwind/borders/ring-offset-width)
- [Ring Width](https://nativewind.dev/v5/tailwind/borders/ring-width)
- [Background Blend Mode](https://nativewind.dev/v5/tailwind/effects/background-blend-mode)
- [Box Shadow Color](https://nativewind.dev/v5/tailwind/effects/box-shadow-color)
- [Box Shadow](https://nativewind.dev/v5/tailwind/effects/box-shadow)
- [Mix Blend Mode](https://nativewind.dev/v5/tailwind/effects/mix-blend-mode)
- [Opacity](https://nativewind.dev/v5/tailwind/effects/opacity)
- [Backdrop Blur](https://nativewind.dev/v5/tailwind/filters/backdrop-blur)
- [Backdrop Brightness](https://nativewind.dev/v5/tailwind/filters/backdrop-brightness)
- [Backdrop Contrast](https://nativewind.dev/v5/tailwind/filters/backdrop-contrast)
- [Backdrop Grayscale](https://nativewind.dev/v5/tailwind/filters/backdrop-grayscale)
- [Backdrop Hue Rotate](https://nativewind.dev/v5/tailwind/filters/backdrop-hue-rotate)
- [Backdrop Invert](https://nativewind.dev/v5/tailwind/filters/backdrop-invert)
- [Backdrop Opacity](https://nativewind.dev/v5/tailwind/filters/backdrop-opacity)
- [Backdrop Saturate](https://nativewind.dev/v5/tailwind/filters/backdrop-saturate)
- [Backdrop Sepia](https://nativewind.dev/v5/tailwind/filters/backdrop-sepia)
- [Blur](https://nativewind.dev/v5/tailwind/filters/blur)
- [Brightness](https://nativewind.dev/v5/tailwind/filters/brightness)
- [Contrast](https://nativewind.dev/v5/tailwind/filters/contrast)
- [Drop Shadow](https://nativewind.dev/v5/tailwind/filters/drop-shadow)
- [Grayscale](https://nativewind.dev/v5/tailwind/filters/grayscale)
- [Hue Rotate](https://nativewind.dev/v5/tailwind/filters/hue-rotate)
- [Invert](https://nativewind.dev/v5/tailwind/filters/invert)
- [Saturate](https://nativewind.dev/v5/tailwind/filters/saturate)
- [Sepia](https://nativewind.dev/v5/tailwind/filters/sepia)
- [Align Content](https://nativewind.dev/v5/tailwind/flexbox/align-content)
- [Align Items](https://nativewind.dev/v5/tailwind/flexbox/align-items)
- [Align Self](https://nativewind.dev/v5/tailwind/flexbox/align-self)
- [Flex Basis](https://nativewind.dev/v5/tailwind/flexbox/flex-basis)
- [Flex Direction](https://nativewind.dev/v5/tailwind/flexbox/flex-direction)
- [Flex Grow](https://nativewind.dev/v5/tailwind/flexbox/flex-grow)
- [Flex Shrink](https://nativewind.dev/v5/tailwind/flexbox/flex-shrink)
- [Flex Wrap](https://nativewind.dev/v5/tailwind/flexbox/flex-wrap)
- [Flex](https://nativewind.dev/v5/tailwind/flexbox/flex)
- [Gap](https://nativewind.dev/v5/tailwind/flexbox/gap)
- [Grid Auto Columns](https://nativewind.dev/v5/tailwind/flexbox/grid-auto-columns)
- [Grid Auto Flow](https://nativewind.dev/v5/tailwind/flexbox/grid-auto-flow)
- [Grid Auto Rows](https://nativewind.dev/v5/tailwind/flexbox/grid-auto-rows)
- [Grid Column Start / End](https://nativewind.dev/v5/tailwind/flexbox/grid-column)
- [Grid Row Start / End](https://nativewind.dev/v5/tailwind/flexbox/grid-row)
- [Grid Template Columns](https://nativewind.dev/v5/tailwind/flexbox/grid-template-columns)
- [Grid Template Rows](https://nativewind.dev/v5/tailwind/flexbox/grid-template-rows)
- [Justify Content](https://nativewind.dev/v5/tailwind/flexbox/justify-content)
- [Justify Items](https://nativewind.dev/v5/tailwind/flexbox/justify-items)
- [Justify Self](https://nativewind.dev/v5/tailwind/flexbox/justify-self)
- [Order](https://nativewind.dev/v5/tailwind/flexbox/order)
- [Place Content](https://nativewind.dev/v5/tailwind/flexbox/place-content)
- [Place Items](https://nativewind.dev/v5/tailwind/flexbox/place-items)
- [Place Self](https://nativewind.dev/v5/tailwind/flexbox/place-self)
- [Accent Color](https://nativewind.dev/v5/tailwind/interactivity/accent-color)
- [Appearance](https://nativewind.dev/v5/tailwind/interactivity/appearance)
- [Caret Color](https://nativewind.dev/v5/tailwind/interactivity/caret-color)
- [Cursor](https://nativewind.dev/v5/tailwind/interactivity/cursor)
- [Pointer Events](https://nativewind.dev/v5/tailwind/interactivity/pointer-events)
- [Resize](https://nativewind.dev/v5/tailwind/interactivity/resize)
- [Scroll Behavior](https://nativewind.dev/v5/tailwind/interactivity/scroll-behavior)
- [Scroll Margin](https://nativewind.dev/v5/tailwind/interactivity/scroll-margin)
- [Scroll Padding](https://nativewind.dev/v5/tailwind/interactivity/scroll-padding)
- [Scroll Snap Align](https://nativewind.dev/v5/tailwind/interactivity/scroll-snap-align)
- [Scroll Snap Stop](https://nativewind.dev/v5/tailwind/interactivity/scroll-snap-stop)
- [Scroll Snap Type](https://nativewind.dev/v5/tailwind/interactivity/scroll-snap-type)
- [Touch Action](https://nativewind.dev/v5/tailwind/interactivity/touch-action)
- [User Select](https://nativewind.dev/v5/tailwind/interactivity/user-select)
- [Will Change](https://nativewind.dev/v5/tailwind/interactivity/will-change)
- [Aspect Ratio](https://nativewind.dev/v5/tailwind/layout/aspect-ratio)
- [Box Decoration Break](https://nativewind.dev/v5/tailwind/layout/box-decoration-break)
- [Box Sizing](https://nativewind.dev/v5/tailwind/layout/box-sizing)
- [Break After](https://nativewind.dev/v5/tailwind/layout/break-after)
- [Break Before](https://nativewind.dev/v5/tailwind/layout/break-before)
- [Break Inside](https://nativewind.dev/v5/tailwind/layout/break-inside)
- [Clear](https://nativewind.dev/v5/tailwind/layout/clear)
- [Columns](https://nativewind.dev/v5/tailwind/layout/columns)
- [Container](https://nativewind.dev/v5/tailwind/layout/container)
- [Display](https://nativewind.dev/v5/tailwind/layout/display)
- [Float](https://nativewind.dev/v5/tailwind/layout/float)
- [Isolation](https://nativewind.dev/v5/tailwind/layout/isolation)
- [Object Fit](https://nativewind.dev/v5/tailwind/layout/object-fit)
- [Object Position](https://nativewind.dev/v5/tailwind/layout/object-position)
- [Overflow](https://nativewind.dev/v5/tailwind/layout/overflow)
- [Overscroll Behavior](https://nativewind.dev/v5/tailwind/layout/overscroll-behavior)
- [Position](https://nativewind.dev/v5/tailwind/layout/position)
- [Top / Right / Bottom / Left](https://nativewind.dev/v5/tailwind/layout/top-right-bottom-left)
- [Visibility](https://nativewind.dev/v5/tailwind/layout/visibility)
- [Z-Index](https://nativewind.dev/v5/tailwind/layout/z-index)
- [Safe Area Insets](https://nativewind.dev/v5/tailwind/new-concepts/safe-area-insets)
- [Container Queries](https://nativewind.dev/v5/tailwind/plugins/container-queries)
- [Height](https://nativewind.dev/v5/tailwind/sizing/height)
- [Max-Height](https://nativewind.dev/v5/tailwind/sizing/max-height)
- [Max-Width](https://nativewind.dev/v5/tailwind/sizing/max-width)
- [Min-Height](https://nativewind.dev/v5/tailwind/sizing/min-height)
- [Min-Width](https://nativewind.dev/v5/tailwind/sizing/min-width)
- [Width](https://nativewind.dev/v5/tailwind/sizing/width)
- [Margin](https://nativewind.dev/v5/tailwind/spacing/margin)
- [Padding](https://nativewind.dev/v5/tailwind/spacing/padding)
- [Space Between](https://nativewind.dev/v5/tailwind/spacing/space-between)
- [Fill](https://nativewind.dev/v5/tailwind/svg/fill)
- [Stroke Width](https://nativewind.dev/v5/tailwind/svg/stroke-width)
- [Stroke](https://nativewind.dev/v5/tailwind/svg/stroke)
- [Border Collapse](https://nativewind.dev/v5/tailwind/tables/border-collapse)
- [Border Spacing](https://nativewind.dev/v5/tailwind/tables/border-spacing)
- [Caption Side](https://nativewind.dev/v5/tailwind/tables/caption-side)
- [Table Layout](https://nativewind.dev/v5/tailwind/tables/table-layout)
- [Rotate](https://nativewind.dev/v5/tailwind/transforms/rotate)
- [Scale](https://nativewind.dev/v5/tailwind/transforms/scale)
- [Skew](https://nativewind.dev/v5/tailwind/transforms/skew)
- [Transform Origin](https://nativewind.dev/v5/tailwind/transforms/transform-origin)
- [Translate](https://nativewind.dev/v5/tailwind/transforms/translate)
- [Animation](https://nativewind.dev/v5/tailwind/transitions-animation/animation)
- [Transition Delay](https://nativewind.dev/v5/tailwind/transitions-animation/transition-delay)
- [Transition Duration](https://nativewind.dev/v5/tailwind/transitions-animation/transition-duration)
- [Transition Property](https://nativewind.dev/v5/tailwind/transitions-animation/transition-property)
- [Transition Timing Function](https://nativewind.dev/v5/tailwind/transitions-animation/transition-timing-function)
- [Content](https://nativewind.dev/v5/tailwind/typography/content)
- [Font Family](https://nativewind.dev/v5/tailwind/typography/font-family)
- [Font Size](https://nativewind.dev/v5/tailwind/typography/font-size)
- [Font Smoothing](https://nativewind.dev/v5/tailwind/typography/font-smoothing)
- [Font Style](https://nativewind.dev/v5/tailwind/typography/font-style)
- [Font Variant Numeric](https://nativewind.dev/v5/tailwind/typography/font-variant-numeric)
- [Font Weight](https://nativewind.dev/v5/tailwind/typography/font-weight)
- [Hyphens](https://nativewind.dev/v5/tailwind/typography/hyphens)
- [Letter Spacing](https://nativewind.dev/v5/tailwind/typography/letter-spacing)
- [Line Clamp](https://nativewind.dev/v5/tailwind/typography/line-clamp)
- [Line Height](https://nativewind.dev/v5/tailwind/typography/line-height)
- [List Style Image](https://nativewind.dev/v5/tailwind/typography/list-style-image)
- [List Style Position](https://nativewind.dev/v5/tailwind/typography/list-style-position)
- [List Style Type](https://nativewind.dev/v5/tailwind/typography/list-style-type)
- [Text Align](https://nativewind.dev/v5/tailwind/typography/text-align)
- [Text Color](https://nativewind.dev/v5/tailwind/typography/text-color)
- [Text Decoration Color](https://nativewind.dev/v5/tailwind/typography/text-decoration-color)
- [Text Decoration Style](https://nativewind.dev/v5/tailwind/typography/text-decoration-style)
- [Text Decoration Thickness](https://nativewind.dev/v5/tailwind/typography/text-decoration-thickness)
- [Text Decoration](https://nativewind.dev/v5/tailwind/typography/text-decoration)
- [Text Indent](https://nativewind.dev/v5/tailwind/typography/text-indent)
- [Text Overflow](https://nativewind.dev/v5/tailwind/typography/text-overflow)
- [Text Transform](https://nativewind.dev/v5/tailwind/typography/text-transform)
- [Text Underline Offset](https://nativewind.dev/v5/tailwind/typography/text-underline-offset)
- [Vertical Align](https://nativewind.dev/v5/tailwind/typography/vertical-align)
- [Whitespace](https://nativewind.dev/v5/tailwind/typography/whitespace)
- [Word Break](https://nativewind.dev/v5/tailwind/typography/word-break)

## Optional

- [Full documentation](https://nativewind.dev/v5/llms-full.txt): Complete Nativewind v5 documentation in a single file for LLM consumption