Flowbite React

⚠️ This is a pre-release version - please note that APIs may change before the final release

Build websites faster with components built on React and Tailwind CSS

--- ### Flowbite React is an open-source collection of UI components built with React and Tailwind CSS utility classes that you can use as a starting point for your user interfaces and websites ## Documentation Browse the components at [flowbite-react.com](https://flowbite-react.com/). Learn more about Flowbite at [Flowbite docs](https://flowbite.com/docs/getting-started/introduction/). ## Getting started Learn how to get started with `Flowbite React` and leverage the interactive React components built with `Tailwind CSS`. ### Using the CLI You can set up Flowbite React using the CLI in two ways: #### 1. Create a new project Create a new Flowbite React application using popular React frameworks and technologies: ```bash npx create-flowbite-react@latest ``` The CLI will prompt for the directory name, what template to use, and if it should initialize a new git repository. For more details about how [`create-flowbite-react`](https://www.npmjs.com/package/create-flowbite-react) works, visit the package page. #### 2. Setup in an existing project To add Flowbite React to an existing project, run: ```bash npx flowbite-react@latest init ``` This will set up all necessary dependencies and configurations in your existing project. ### Framework Integration Guides Follow our official integration guides to set up Flowbite React with your preferred framework or technology stack: - [AdonisJS](https://www.flowbite-react.com/docs/guides/adonisjs) - [Astro](https://www.flowbite-react.com/docs/guides/astro) - [Blitz.js](https://www.flowbite-react.com/docs/guides/blitzjs) - [Bun](https://www.flowbite-react.com/docs/guides/bun) - [ESBuild](https://www.flowbite-react.com/docs/guides/esbuild) - [Farm](https://www.flowbite-react.com/docs/guides/farm) - [Gatsby](https://www.flowbite-react.com/docs/guides/gatsby) - [Laravel](https://www.flowbite-react.com/docs/guides/laravel) - [Meteor.js](https://www.flowbite-react.com/docs/guides/meteorjs) - [Modern.js](https://www.flowbite-react.com/docs/guides/modernjs) - [Next.js](https://www.flowbite-react.com/docs/guides/nextjs) - [Parcel](https://www.flowbite-react.com/docs/guides/parcel) - [React Router](https://www.flowbite-react.com/docs/guides/react-router) - [React Server](https://www.flowbite-react.com/docs/guides/react-server) - [RedwoodJS](https://www.flowbite-react.com/docs/guides/redwoodjs) - [Remix](https://www.flowbite-react.com/docs/guides/remix) - [Rsbuild](https://www.flowbite-react.com/docs/guides/rsbuild) - [Rspack](https://www.flowbite-react.com/docs/guides/rspack) - [TanStack Router](https://www.flowbite-react.com/docs/guides/tanstack-router) - [TanStack Start](https://www.flowbite-react.com/docs/guides/tanstack-start) - [Vike](https://www.flowbite-react.com/docs/guides/vike) - [Vite](https://www.flowbite-react.com/docs/guides/vite) - [Waku](https://www.flowbite-react.com/docs/guides/waku) - [Webpack](https://www.flowbite-react.com/docs/guides/webpack) ## Components **Note: Some components from the vanilla Flowbite library are not yet available in Flowbite React.**

Accordion	Alert	Avatar

Banner	Badge	Breadcrumb

Button	Button group	Card

Carousel	Datepicker	Dropdown

Footer	Forms	List group

Modal	Navbar	Pagination

Progress bar	Rating	Sidebar

Spinner	Table	Tabs

Tooltip	Timeline	Toast

Sticky Banner

## Community Get help or discuss the library with the community: ⌨️ [Discuss Flowbite on GitHub](https://github.com/themesberg/flowbite/discussions) For casual conversations with other users using the library: 💬 [Join the Flowbite Discord Server](https://discord.gg/4eeurUVvTy) ## Contributing We appreciate your interest in contributing! Please visit our [guide on contributing](https://github.com/themesberg/flowbite-react/blob/main/.github/CONTRIBUTING.md) to get started. ## Figma For access to the Figma design files for our components, visit: 🎨 [Get access to the Figma design files](https://flowbite.com/figma/) ## Copyright and license The Flowbite name and logos are trademarks of Bergside Srl. 📝 [Read about the licensing terms](https://flowbite.com/docs/getting-started/license/) 📀 [Brand guidelines and trademark usage agreement](https://flowbite.com/brand/)