

GitHub - tada5hi/eldin: A lightweight, type-safe dependency injection container for TypeScript with scoped lifetimes and hierarchical containers.
github.comGitHub - tada5hi/vuecs: Vue 3 theming framework — themeable components, design tokens, dark mode & runtime palettes. Themes for Tailwind, Bootstrap & Bulma: one app.use() reskins everything. SSR-ready via @vuecs/nuxt.
github.comvuecs — Vue 3 components that render native Tailwind, Bootstrap or Bulma, with runtime theme & palette switching
Hey r/vuejs 👋
I've been building vuecs, a Vue 3 theming framework with a component library on top, and it's at the point where I'd like feedback from people who aren't me.
The problem it solves: component libraries hard-couple structure to styling. If your library is Tailwind-based and your app is Bootstrap (or mid-migration between two design systems), you're stuck. vuecs separates the two: components define structure and behavior, themes define appearance, and a resolution engine merges them at runtime.
app.use(vuecs, { themes: [tailwind()] }); // app renders with Tailwind classes
app.use(vuecs, { themes: [bootstrap()] }); // same code, now real .btn / .card / .form-control
The Bootstrap and Bulma themes emit those frameworks' native classes, not Tailwind lookalikes, so vuecs components sit visually next to existing Bootstrap/Bulma markup without seams.
What ships today:
- 20+ packages: forms, table (sorting, selection, expansion), list, overlays (modal/popover/tooltip/menus/toast), navigation, pagination, skeletons, with a11y handled by Reka UI primitives underneath
- Runtime palette switching:
useColorPalette().set({ primary: 'emerald' })re-tints every component, including native Bootstrap/Bulma widgets, with no rebuild - Dark mode (
light/dark/system) driven by design tokens, SSR-safe via the Nuxt module (no flash on first paint) - Design tokens (OKLCH color scales, radii, motion) usable with Tailwind, Bootstrap, Bulma, or standalone
You can build your own component library on it. The theming machinery is public API, not internal plumbing: useComponentTheme() plus a couple of helpers make your own components first-class citizens of the theme system, with full TypeScript autocomplete for theme authors via an augmentable registry. defineTheme() lets you publish a theme that extends an existing one. The payoff: a downstream app reskins your library and the vuecs components through the same single config, and you as a library author never dictate a CSS framework. Guide: https://vuecs.dev/guide/build-themable-component
Why not Nuxt UI / shadcn-vue? Those are excellent if you're all-in on Tailwind. vuecs targets the cases where you're not: Bootstrap/Bulma codebases, incremental design-system migrations, and library authors who don't want to dictate their consumers' CSS framework.
Links:
- Docs: https://vuecs.dev
- GitHub (Apache-2.0): https://github.com/tada5hi/vuecs
- Example apps (one per theme, plus Nuxt): https://github.com/tada5hi/vuecs/tree/master/examples
Quality-wise: every theme is audited against the component catalog in CI, plus a Playwright visual-regression matrix (3 themes × every demo view).
Honest feedback welcome, especially "this exists already and it's called X" or "this API would annoy me because Y".