Live data from Hacker News

Show HN: Flowbite – Tailwind CSS Components Library

flowbite.com

41–50 of 60 posts

Re: Show HN: Flowbite – Tailwind CSS Components Library

#41
post #37
post #20

Question: are there any mature CSS component frameworks out there aside from Bootstrap and Bulma? And why aren't there more?

There are lots, it's just that many mostly advertise themselves as component libraries for particular frameworks. Oftentimes you'll find that the common core is just plain ol' CSS with a little bit of JS in the background.

It would be great if some front-end developer can chime in to tell us which frameworks are worth trying besides Bootstrap (Tailwind?), or it is all yak shaving. Currently I only reach to another framework if:

- I want something lightweight and not bother to deal with compiling/preprocessing (like Milligram).

- I want a MVP without classes (like Picnic.css)

Otherwise I pay a premium theme or create one myself.

Re: Show HN: Flowbite – Tailwind CSS Components Library

#42
post #39

Earlier quoted context omitted.

On bootstrap, Foundation, semantic UI you have all of the CSS code included, on tailwind and windicss you only include what's actually on the page by compiling it.

Not an expert here, but cannot you tree shake Bootstrap too? https://medium.com/@jacobp100/tree-shaking-bootstrap-95d6301...

To a certain degree and also on semantic, but it always have a core CSS which is largish, windi and tailwind is on a granular/utility basis. So it's often something like 8kb for a page with tailwind/windi but +100kb for semantic.

Re: Show HN: Flowbite – Tailwind CSS Components Library

#43

Earlier quoted context omitted.

Do the pro version allow re-use in templates?

Please read the full licensing terms for the pro version here: https://flowbite.com/license .

It was a very simple question, should I ask a lawyer too?

Update: I read it and it's unclear, so that's a no then.

Re: Show HN: Flowbite – Tailwind CSS Components Library

#44
Looks great. One comment re. the docs, as a paid user of Tailwind UI, I really like the way they lay out their components on their docs site. The markup is hidden by default, with buttons to click to grab the source code.

And this makes sense because I'm not browsing the docs looking for markup that I like. I'm looking for a suitable UI component and only once I've picked something am I interested in the specific markup for that one chosen component.

Your docs at the moment have the effect of emphasising the markup more than anything else on the page (due to the dark-themed code snippets, which normally I like!) and when I'm in UI design mode, I'm thinking very visually and really only want to see a clean page listing the various components available.

Other than that, the docs are great so this is only a possible optimisation rather than a major big deal!

Re: Show HN: Flowbite – Tailwind CSS Components Library

#45
post #20

Question: are there any mature CSS component frameworks out there aside from Bootstrap and Bulma? And why aren't there more?

Not sure if it matches your criteria of a mature component framework, but there's Foundation and UIkit. I've used both but all of my new projects use Tailwind. It matches my needs better because I use minimal JavaScript. It also doesn't get in my way and the documentation is refreshingly clear.

https://get.foundation/

https://getuikit.com/

> And why aren't there more?

It seems to me these tightly coupled CSS + JS component frameworks are in an awkward position these days. React/Vue allows you more flexibility. If a project is really simple you can use vanilla JavaScript or something like Alpine.js.

Perhaps the demand isn't there anymore.

Re: Show HN: Flowbite – Tailwind CSS Components Library

#46
post #40

Earlier quoted context omitted.

I got interested in atomic CSS a few years ago and used it on numerous projects for over a year. In the end I actually found the real world application of it a step backwards. What you gain in getting up and running quickly you loose in maintainability in my experience.

We keep all of our components in template files so it's quite easy to maintain for us. If we need to change all of the buttons across the app, we just update the Button component.

I also was using component tempalte files although the issue was apparent when returning to any component with any degree of complexity. Regular CSS class names tend to give you a bit of an insight into the role of each div whereas atomic css requires you to parse each line to understand it's role which gets a bit tiring after a while. I tried extracting the strings of atomic class names to variables as a sort of hybrid approach but in the end it felt more or less like emulating 'normal' CSS. I'm sure different projects would fair better though with an atomic approach though.

Re: Show HN: Flowbite – Tailwind CSS Components Library

#48
post #47

I've been using DaisyUI which seems similar to this. I'd love to hear people's thoughts on Flowbite vs DaisyUI. Is it worth the switch?

First of all Flowbite is based on and also includes a Figma design file and it is also different in terms of styling.

We chose a cleaner and more enterprise design to target high-end developers and companies.

I suppose that the differences and whether one or the other is better depends on your project and what you want.

Re: Show HN: Flowbite – Tailwind CSS Components Library

#49
post #47

I've been using DaisyUI which seems similar to this. I'd love to hear people's thoughts on Flowbite vs DaisyUI. Is it worth the switch?

First of all Flowbite is based on and also includes a Figma design file and it is also different in terms of styling. We chose a cleaner and more enterprise design to target high-end developers and companies. I suppose that the differences and whether one or the other is better depends on your project and what you want.

Got it.

So DaisyUI is more for weekend projects where devs themselves own the design.

Whereas Flowbite is meant more for working with a real designer and easily translate the professional design into tailwind-based code.

Cool. Thanks!

Post reply on HN