Introduction
A brief overview of UI Thing for Nuxt, its philosophy, and how it differs from traditional component libraries.
UI Thing is a collection of beautifully designed, reusable UI components built specifically for Nuxt, powered by Reka UI and Tailwind CSS. This project is inspired by shadcn/ui, with adaptations to fit Nuxt's framework and developer ecosystem.
Note: This is not a traditional component library you install via npm. Instead, it hands you open, editable code-so you can pick the components you need, copy them into your app, and customize as you see fit.
Why "UI Thing" for Nuxt?
- Open Code Philosophy
Every component is fully visible and editable-no wrappers or opaque abstractions. This gives you full control to adapt the UI to your design system. This makes it especially AI-friendly, letting models read, understand, and even generate new components. - Nuxt-Native
Created with the Nuxt ecosystem at heart, UI Thing respects Nuxt's conventions-whether you're on Nuxt 3 or upgrading to Nuxt 4-and integrates smoothly with your app's structure and tooling. - DIY, Your Way
Rather than bundling code you can't touch, UI Thing encourages you to copy, paste, and personalize any component. The code becomes entirely yours-no extra layers, no wrappers. - Learn & Build
This project started as an experiment-and a fun one at that. I wanted to explore building an entire component reference for Nuxt, and along the way, I created a CLI to streamline the dev experience.
Comparison Table
| Feature | UI Thing (for Nuxt) | Traditional Component Library |
|---|---|---|
| Distribution | Copy-paste + CLI | Publish to npm, import as a dep |
| Customization | Directly edit code | Override or wrap components |
| Nuxt Compatibility | Built for Nuxt conventions | Generic (may require adaptation) |
| CLI Support | Yes | Sometimes minimal or none |
| Ideal Use Case | Highly customizable UIs | Quick plug-and-play UIs |