# react-native-flex-layout [![Twitter Follow](https://img.shields.io/twitter/follow/rn_material?style=social)](https://twitter.com/intent/user?screen_name=rn_material)

> Layout primitives for React Native.

[![npm](https://img.shields.io/npm/v/react-native-flex-layout)](https://www.npmjs.com/package/react-native-flex-layout)
[![NPM Downloads](https://img.shields.io/npm/dm/react-native-flex-layout.svg)](https://www.npmjs.com/package/react-native-flex-layout)
[![Used Languages](https://img.shields.io/github/languages/top/yamankatby/react-native-material.svg)](https://github.com/yamankatby/react-native-flex-layout)

## Docs

**https://react-native-flex-layout.js.org**

⚛️ [Components](https://react-native-flex-layout.js.org/components/box) · 📚 [Guides](https://react-native-flex-layout.js.org/guides/spacing) · 📖 [Examples](https://react-native-flex-layout.js.org/examples/toolbar)

## Installation

```sh
npm install react-native-flex-layout
```

## Usage

```js
import {
  Box,
  Flex,
  Stack,
  Wrap,
  Selector,
  // ...
} from "react-native-flex-layout";

const App = () => {
  return <Flex fill center />;
};
```

## Support & help 

If you get stuck, contact [@yamankatby](https://twitter.com/yamankatby) on Twitter
or [open a discussion on GitHub](https://github.com/yamankatby/react-native-flex-layout/discussions). In case of
bugs, [open an issue on GitHub](https://github.com/yamankatby/react-native-flex-layout/issues).

## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.