A shadcn/ui-inspired component library for Rails built on ViewComponent — over 80 components, from buttons and forms to data tables, command palettes, and calendars.
Acknowledgements — The visual design, CSS class choices, and component structure of ViewPrimitives are heavily inspired by shadcn/ui and its Svelte port shadcn-svelte.
Components are copied into your app via a generator — not imported from a package. Tailwind classes live in your own files, so any Tailwind setup works out of the box: tailwindcss-rails, cssbundling-rails, Vite, esbuild — no configuration required.
#Why ViewPrimitives?
- You own the code - Components land in
app/components/ui/as plain Ruby and ERB files, editable like any other file in your app - Zero build config - Tailwind 4 reads design tokens straight from CSS via
@theme inline— notailwind.config.jsrequired - Broad coverage - Primitives, forms, navigation, overlays, data display, and media components covering most of what a typical admin or marketing UI needs
- Themeable - Swap color themes or edit the OKLCH design tokens in one file
- Selective installs - Add and update components one at a time with a generator, instead of pulling in the whole library
#Example
rails g view_primitives:install
rails g view_primitives:add button alert<%= ui :button, "Save changes", variant: :outline %>
<%= ui :alert, title: "Heads up!", description: "Check your settings." %>