Show HN: Free High-quality TailwindCSS Components. No attribution required | Hacker News Reader

Show HN: Free High-quality TailwindCSS Components. No attribution required

tailspark.co

34 pointsandyydao21 comments

This looks like a great collection, but I immediately have questions about quality when the are multiple sizing / overflow issues on the marketing page on my phone.

Applaud the effort, and I think this kind of project is a really good substitute for an info-product or ebook: relatively low effort to get started, lots of room to scale + grow if it goes well, and in general a good way of "getting in the reps" of building a business.

However — I think you need to spend a lot more time putting yourself in the shoes of who would use such a product. As an example, going to the "Modal" section shows me four very small thumbnails, of which I can only really discern the high-level structure and not any of the actual details. Having to copy and paste this into my own editor or something like CodePen just to see how it really "works" is a very rough feedback loop compared to all the other existing tailwind component sites (take, for example, how Flowbite handles it: https://flowbite.com/docs/components/modal/).

Also, for projects like this I like to have some level of social proof and your social media links in the footer are broken! That, coupled with the "trusted by 1000+ businesses", gives off some ... bad vibes, to put it mildly.

My feedback:

The first things I looked for were primitive components, like buttons, forms, etc. to give me a sense of how the components would fit together cohesively. I only see higher level combined components (pricing page, FAQ, etc.).

I feel that your website has various different versions of these higher level components (that don't fit together cohesively) and isn't that useful.

"Copy and paste only works in Chrome" ...

I can't even figure out what this page is trying to sell to me.

This?

Spread theSpark and Get rewarded! Earn up to 10% Lifetime commission on all our Products including our monthly and yearly plans which start from $2195/month

They’re selling unlimited design as a subscription (not a new idea) and the free components are a hook to get customers for their service.

I’m not connected to it in any way but it seems like a well intentioned venture so I find the negative comments a bit harsh, even for HN

I find CSS terrible to work with but I fail to see how this is any better.

  <div class="[grid-area:span_1_/_span_1_/_span_1_/_span_1] max-[991px]:h-[400px] max-[767px]:h-[250px]">

Do you think that's representative of average tailwind, or have you chosen a particularly horrible case?

Edit: looking around my codebases (granted I don't write much code anymore) most of it doesn't look like that, but a small amount of components do have some gnarly classes.

Not really. I copied one of the components and picked a random line. Some were worse than this.

Actually, looking at some examples, this is absolutely atrocious markup. Tons of empty divs with random CSS properties that are invisible and take up zero space. Hardcoded color values that should use the Tailwind color scales.

My bet is that they made some designs with WYSIWYG in Webflow, and automatically converted them to Tailwind.

EDIT: The dead giveaway is that they’re not using Tailwind’s breakpoints, but instead hardcoded ones, that happen to all be the same as Webflow’s hardcoded breakpoints - 478, 767, and 991 pixels.

I am familiar with TW, but not familiar with this syntax. Can someone explain or link to where it explains it?

I’m a fan of TailwindCSS and use it when I can, but damn. That is an abuse of the Tailwind JIT compiler. Utility classes are not an invitation to abandon custom CSS entirely.

I don't know. Kudos for providing free tailwind components, but to me, this page looks broken on a modestly recent iPhone.

- overflowing text

- misaligned buttons+inputs

- horizontally scrollable pages

- screenshots with text in them but no heading: can't discern what the screenshot is showing; additionally, the pill-shaped things on top cover the text in the images in case I try to read it to find out where the link takes me

- "components" navigation item takes me nowhere? or to the start page? then why is it not highlighted?

- colors and shapes feel slightly messy and arbitrary

Saying something is high quality does not necessarily mean they are. Sorry.

Also your site is broken on mobile.

These types of threads are always super popular because everyone wants TailwindUI without having to fork over the $299 for all-access. While I have not purchased TailwindUI yet, looking at other frameworks that try to do the same thing the only one that gets even remotely close is DaisyUI but even that is just not the same.

Folks you are not going to find something of the same quality of caliber as TailwindUI for free, it's clear the TW team spent an enormous amount of time on that product and the price point reflects it.

I see trademarked logos like PayPal hotlinked to a site called "https://assets.website-files (.) com". This is not OK!

I just discovered tailwind after using bootstrap for a few years...

Yes. It is amazing. Flowbite is the component library I've been using.

That page uses so much CPU and memory, I have doubts about using anything it offers.

Finding anything on the site is impossible, and quality is subpar to say the least.

No transparency of who is running this service. Mighty weird and sus.

Reply on news.ycombinator.com