←back to thread

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

144 points hunvreus | 6 comments | 13 May 25 11:22 UTC | HN request time: 1.087s | source | bottom

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. o_m ◴[13 May 25 16:16 UTC] No.43974558[source]▶
Why did you decide going old school using Alpine.js instead of using plain vanilla web components?
replies(2): >>43975832 #>>43978928 #
2. edoceo ◴[13 May 25 18:03 UTC] No.43975832[source]▶
Alpine is old school now?
replies(1): >>43977956 #
3. o_m ◴[13 May 25 21:31 UTC] No.43977956[source]▶
I'd say anything new in 2025 that involves working with the DOM that doesn't use web component is a waste. Lately I have been porting some old JS libraries (7+ years old) that still are visually impressive to web components, and in my experience after porting some libraries there is about 30% fewer lines of code. Before web components there was so much work to get things up and running in the DOM. Alpine.js does this behind the scenes, but there isn't really a need for it anymore.
replies(1): >>43981010 #
4. hunvreus ◴[13 May 25 23:18 UTC] No.43978928[source]▶
I did seriously consider it, but again that was about trying to solve the problem in the least opinionated way.

Which is also why I made the Alpine code as unobtrusive as possible.

You can get away with using purely the CSS if you don't need dialogs or combobox. And you can plug your own JS if you decide to do so.

However, I will definitely try and see if I can make a web components version as soon as I have some time.

5. edoceo ◴[14 May 25 05:02 UTC] No.43981010{3}[source]▶
I've been using RiotJS when I need partial component support - wasn't an all-in thing like React ; and I thought HTMX and Alpine are also good for these partial upgrades. Maybe WebComponents are fully supported now? (I can't keep up)
replies(1): >>43984109 #
6. 1oooqooq ◴[14 May 25 13:09 UTC] No.43984109{4}[source]▶
https://caniuse.com/?search=web%20components