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.

Learn more about Flowbite at Flowbite docs.

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:

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 works, visit the package page.

2. Setup in an existing project

To add Flowbite React to an existing project, run:

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
• Astro
• Blitz.js
• Bun
• ESBuild
• Farm
• Gatsby
• Laravel
• Meteor.js
• Modern.js
• Next.js
• Parcel
• React Router
• React Server
• RedwoodJS
• Remix
• Rsbuild
• Rspack
• TanStack Router
• TanStack Start
• Vike
• Vite
• Waku
• 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

For casual conversations with other users using the library:

💬 Join the Flowbite Discord Server

Contributing

We appreciate your interest in contributing! Please visit our guide on contributing to get started.

Figma

For access to the Figma design files for our components, visit:

🎨 Get access to the Figma design files

Copyright and license

The Flowbite name and logos are trademarks of Bergside Srl.

📝 Read about the licensing terms 📀 Brand guidelines and trademark usage agreement