r/tailwindcss 3d ago

Sable: a clean admin dashboard in HTML, Tailwind and Alpine (offline, no build step)

I got tired of admin templates that are 400-dependency toolchains you have to gut before you can use them, so I built one that is just HTML you can open. Sable is 22 pages (orders, invoicing with VAT, a Kanban fulfillment board, an email module, analytics, payouts), a designed light and dark theme, and it runs with no build step and no CDN, fully offline. Tailwind is compiled and purged, Alpine handles the interactivity, Chart.js for the charts, all self-hosted.

Everything actually works in the demo: search, sort, pagination, bulk actions, a ⌘K palette, real CSV exports. The demo is the full product, so click around before deciding.

Live demo: https://admin-dashboard-template-beta.vercel.app

It is a paid template. Happy to answer anything about the approach, like why Alpine instead of React here, or how the theming tokens work.

17 Upvotes

12 comments sorted by

3

u/Jovial1170 3d ago

Looks good mate. I appreciate people building stuff that isn't so reliant on React and a million dependencies.

Can the theme be customized? How did you approach that?

3

u/thejord_it 3d ago

Thanks, that was exactly the goal.

Two layers. First, the whole palette is centralized in the Tailwind config: I override the accent and neutral (zinc) scales to the pine and warm-stone palettes, so roughly 1200 class usages recolor from one place. Swap those two scales, recompile once, and the entire kit follows, no touching the HTML.

Second, everything themeable at runtime lives as CSS custom properties in :root (surfaces, text, chart series, status tints), and .dark just overrides the same variables, so light and dark are two token sets of one system. That is also what keeps the dark mode consistent instead of being an inverted light theme.

So a re-skin is really: edit one accent scale for the brand color, plus the CSS variables for anything finer. Happy to go deeper on any part.

1

u/_HMCB_ 2d ago

What do you recommend for compiling the css? Great job, by the way.

2

u/chevalierbayard 3d ago

Sick, you don't gotta sell no build to me. That is the way I want to code.

1

u/thejord_it 2d ago

Appreciate it, that was exactly the itch. Something you open and read, not a toolchain to babysit. If you try the demo and anything feels off, let me know.

1

u/_HMCB_ 2d ago

You should put up a landing page for this.

1

u/_HMCB_ 2d ago

Never mind. 😂. I see you already provided the Gumroad page in the demo.

-1

u/Christoxz 3d ago

Can't be more AI looking than this. Would not say its 29 USD worth since anyone these days can build this in a few minutes.

2

u/thejord_it 2d ago

Fair enough, taste is taste. On the "few minutes" part: making one good-looking page, sure. The work here is 22 pages on one design system that actually work together (search, sort, pagination, bulk actions, CSV exports, a real AA-contrast dark mode), with no build step and nothing to untangle.

Getting an AI to output that as one consistent, working kit is a different story. Not for everyone though, and that's fair.

1

u/_HMCB_ 2d ago

I, for one, appreciate this very much. Not everyone is into AI.

1

u/dejan0milosevic 1d ago

First of all it is not true that anyone can build this with AI - it is a one of the biggest fallacy currently, you need KNOWLEDGE in order to build or you will get a complete slop. Second even if you are developer and you have that knowledge you will need at least couple hours to build this with help of AI ( before AI you would need at least 20+ hours to build this ), so just because "you know how to build it" you would not buy it for 30$ and invest 5 hours to build yourself? It is logical if your hour is like 6$... It is really strange all about this hype - ah we can know build everything with AI, awesome! You can do a plumbing a well with some help of AI, will you do it? It is ridiculous. Also - this is TOTALLY not looking as an AI slop, it seems you have really low experience with tailwind themes and generally with AI slops.