react-native-tailwindcss

Why?Installation Translations Special cases Directional layout

Core Concepts

Flexible styling

Customization

Configuration Theme Configuration Customizing Colors Customizing Spacing

Layout

Display Object Fit Overflow Position Top / Right / Bottom / Left Tint Color Z-Index

Typography

Font Family Font Size Font Style Font Weight Letter Spacing Line Height Text Alignment Text Color Text Decoration Text Transform Vertical Alignment (Android)

Backgrounds

Background Color

Borders

Border Color Border Style Border Width Border Radius

Flexbox

Flex Direction Flex Wrap Align Items Align Content Align Self Justify Content Flex Flex Grow Flex Shrink

Spacing

Sizing

Width Min-Width Max-Width Height Min-Height Max-Height

Effects

Box Shadow Text Shadow Opacity

Max-Height

Class	Properties
t.maxHFull	maxHeight: '100%'
t.maxHScreen	maxHeight: '100vh'

Usage

Set the maximum height of an element using the t.maxHFull or t.maxHScreen utilities.

t.maxHFull

react-native-tailwindcss

TVke
tvke91@gmail.com

A react-native style system based on TailwindCSS that let's you easily apply styles to react native components in a tailwindCSS-like fashion. The utility classes are transformed to object valid names and are all children from an object t, tw, theme or tailwind.