<div align="center">
<div align="center">
  <img width="120" style="margin: 32px" src="https://raw.githubusercontent.com/form-atoms/field/main/public/form-atoms-field.svg">
   <img width="120" style="margin: 32px" src="https://raw.githubusercontent.com/form-atoms/flowbite/main/public/plus-dark.svg#gh-light-mode-only">
   <img width="120" style="margin: 32px" src="https://raw.githubusercontent.com/form-atoms/flowbite/main/public/plus-light.svg#gh-dark-mode-only">
   <img width="110" style="margin: 32px" src="https://github.com/themesberg/flowbite-react/blob/main/apps/web/public/android-chrome-192x192.png?raw=true">
   </div>
  <h1>Form Atoms with Flowbite React style</h1>
</div>

<a aria-label="Minzipped size" href="https://bundlephobia.com/result?p=%40form-atoms/flowbite">
  <img alt="Bundlephobia" src="https://img.shields.io/bundlephobia/minzip/%40form-atoms/flowbite?style=for-the-badge&labelColor=24292e">
</a>
<a aria-label="NPM version" href="https://www.npmjs.com/package/%40form-atoms/flowbite">
  <img alt="NPM Version" src="https://img.shields.io/npm/v/%40form-atoms/flowbite?style=for-the-badge&labelColor=24292e">
</a>

### Demo

Visit project's [🎨 Storybook](https://form-atoms.github.io/flowbite/)

### Prerequisites

1. Install the headless form components [@form-atoms/field](https://github.com/form-atoms/field#readme).

2. Install the [flowbite-react](https://github.com/themesberg/flowbite-react) components.

### 📦 Installation

```
yarn add @form-atoms/flowbite
```
