Theming Flowbite React to look lke standard Flowbite

[sazzer]

Hi there,

Apologies if this has already been asked/answered. I've looked but it's not the easiest topic to search for :\

I'm building a new app using Flowbite and using React. I've chosen to use Flowbite standard for most of the components, and Flowbite React for any of the ones which need it - e.g. dropdowns. That just gives me more control in the exact styling of everything.

However, I've noticed that the Flowbite React components look significantly different to the standard styling suggested by standard Flowbite.

For example:

A standard Flowbite button:

A Flowbite React dropdown:

Most obviously is the colour, but I've also noticed that the padding is different, and probably other details as well.

Is there any easy way to theme Flowbite React to look the same as standard Flowbite? Or do I need to work out all of the details for my own theme?

Cheers

[bormm]

Its a good hint because I am currently checking Flowbite Standard + Flowbite react and noticed that I could into the issue that components are missing in the react package and I need to mix it with plain Flowbite Standard. I expected it would work out of the box, but your question seems it's an issue out of the box and I should consider then using Flowbite Standard only. Where do you "need" to use Flowbite React that can't be archived using Flowbite Standard?

[sazzer]

You technically don't need to use Flowbite React anywhere. Everything can be done using standard Flowbite and some JavaScript.

However, in some cases the JavaScript can get quite involved. For example, dropdown menus. And in particular being able to close them by clicking outside of the menu. Using the pre-built component is much easier but it was very noticeable that they look different to each other.