https://github.com/vuelessjs/vueless-module-nuxt
Nuxt Styleless UI Component Library, powered by Tailwind CSS π
https://github.com/vuelessjs/vueless-module-nuxt
a11y design-system headlessui nuxt nuxt-ui nuxt3 nuxtjs nuxtui styleless tailwindcss ui-components ui-library vite vue vue-components vue-datepicker vue-library vue-select vue-table vue3
Last synced: 19 days ago
JSON representation
Nuxt Styleless UI Component Library, powered by Tailwind CSS π
- Host: GitHub
- URL: https://github.com/vuelessjs/vueless-module-nuxt
- Owner: vuelessjs
- License: mit
- Created: 2024-09-08T14:51:41.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-04-01T15:13:44.000Z (10 months ago)
- Last Synced: 2025-04-01T15:23:36.376Z (10 months ago)
- Topics: a11y, design-system, headlessui, nuxt, nuxt-ui, nuxt3, nuxtjs, nuxtui, styleless, tailwindcss, ui-components, ui-library, vite, vue, vue-components, vue-datepicker, vue-library, vue-select, vue-table, vue3
- Language: Vue
- Homepage: https://vueless.com
- Size: 2.83 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README

# Vueless Nuxt Module
[Vueless UI](https://github.com/vuelessjs/vueless) β a UI library with Open Architecture for Vue.js 3 and Nuxt.js 3 / 4, powered by [Storybook v10](https://storybook.js.org) and [Tailwind CSS v4](https://tailwindcss.com).
**With Vueless UI, youβre free to:**
- πͺοΈ Customize any component
- π Copy and extend existing ones
- π§± Build your own from scratch
- π Document it all seamlessly in Storybook
[Documentation](https://docs.vueless.com/) | [UI Components](https://ui.vueless.com/) | [Theme Customizer](https://my.vueless.com/theme) | [About](http://vueless.com/)
### Key features
- π§© 65+ crafted UI components (including range date picker, multi-select, and nested table)
- β¨ Open Architecture lets you customize, copy, extend, and create your own components
- π Built-in Storybook support
- πͺ© Theme Builder for runtime theme customization
- π Beautiful default UI theme
- π Unstyled mode
- π Light and dark mode
- 𧬠Design tokens powered by CSS variables
- βοΈ Server-side rendering (SSR)
- π Internationalization (i18n)
- βΏοΈ Accessibility (a11y)
- πΌοΈ Inline SVG icons
- πͺ Auto component imports (as you use them)
- π§Ώ Uncompiled source in npm for better DX
- π§ͺοΈ 1300+ unit tests ensuring consistent logic
- π‘οΈ Full TypeScript support with type safety
## Built-In Storybook
No setup, no hacks β just a fully functional Storybook preset ready to test your Vueless UI design system out of the box.
[Demo](https://ui.vueless.com) | [Package](https://www.npmjs.com/package/@vueless/storybook) | [Docs](https://docs.vueless.com/installation/storybook)

## Theme Builder
Customize colors, rounding, and typography at runtime, generate full palettes, and export a ready-to-use theme to your project.
[Try Vueless UI Theme Builder](https://my.vueless.com/theme) π

## Quick Start
1. Install Vueless Nuxt module.
```bash
npm install @vueless/nuxt
npx vueless init
```
2. Register `@vueless/nuxt` into the Nuxt config modules section.
```javascript
export default defineNuxtConfig({
modules: [
'@vueless/nuxt'
],
...
})
```
3. Import Tailwind CSS and Vueless at the top of the main CSS file.
```scss
@import "tailwindcss";
@import "vueless";
```
## Contributing
* We encourage you to contribute to Vueless! Please check out the
[contributing to Vueless](CONTRIBUTING.md) for guidelines.
* Trying to report a possible security vulnerability in Vueless? Please
check out our [security policy](SECURITY.md) for guidelines.
* Everyone interacting in Vueless and its sub-projects' codebases, issue trackers, chats, and mailing lists is expected to follow our [code of conduct](CODE_OF_CONDUCT.md) rules.
## License
Vueless is released under the [MIT License](https://opensource.org/licenses/MIT).
---
From Ukrainians to a Peaceful World πΊπ¦