←back to thread

Show HN: Basecoat – shadcn/UI components, no React required

144 points hunvreus | 3 comments | 13 May 25 11:22 UTC | HN request time: 0.396s | source

Basecoat ports the upcoming shadcn/ui v4 [1] to plain HTML + Tailwind (no React):

- Live demo & documentation: https://basecoatui.com

- MIT‑licensed and free: https://github.com/hunvreus/basecoat/

- Works with any backend (Flask, Django, Rails, PHP, etc.) or static site.

- Fully theme‑compatible with shadcn/ui [2].

- Uses a sliver of Alpine.js only for a few interactive bits (e.g. combobox). Swap in your own JS if you prefer.

- Dead simple to use, just drop in a class here and there:

  <button class="btn" data-tooltip="This is a tooltip text">Click me</button>
Why I built it: after moving from a Next.js stack back to Flask + Tailwind + HTMX, I missed shadcn/ui and didn’t want walls of Tailwind classes (like Flowbite or Preline).

Feedback is most welcome: bugs, requests for components, criticism.

[1]: https://v4.shadcn.com/

[2]: https://basecoatui.com/installation/#install-theming

[3]: https://pagescms.org

1. diiiimaaaa ◴[13 May 25 16:55 UTC] No.43975035[source]▶
So if I understand correctly all JS is custom-written Alpine JS components.

And all CSS is custom classes that use Tailwind @apply, I'm not sure why, can someone elaborate.

replies(2): >>43978978 #>>43982163 #
2. hunvreus ◴[13 May 25 23:23 UTC] No.43978978[source]▶
- I prefer using Alpine rather than Vanilla JS these days. But the JS code is only for dialogs, combobox and tabs. I don't even use it myself on most simple projects. Curious what you would recommend using instead? Web components?

- I use `@apply` in all of my custom Tailwind classes. It's easy to keep it consistent with the rest of your styles, and in this case it meant it was pretty easy for me to copy a good chunk of shadcn/ui's own components. You usually just use regular CSS for custom Tailwind utility classes?

3. strzibny ◴[14 May 25 08:15 UTC] No.43982163[source]▶
I also use @apply with Tailwind, makes this a beautiful not spagetti experience.