nuitral Vue UI suite

nuitral Vue UI suite provides a complete, native, and flexible UI component library for Vue projects.

This library is part of the nuitral suite, a native UI toolkit designed to build modern, flexible, and high-performance interfaces.

Explore the suite

Run the Local Demo

To run this library locally, first install the dependencies:

npm i

Then, use one of the following commands:

• Run the local demo:

  npm run demo

• Run in development mode:

  npm run dev

⚠️ When running in development mode, make sure all related libraries are located in the same root directory as this project.
Otherwise, update the Vite configuration aliases accordingly:

vite.config.ts in dev mode

const alias = {
	'@nuitral/core': path.resolve(__dirname, '../core/lib'),
	'@nuitral/theming': path.resolve(__dirname, '../theming/lib/scss/_index.scss'),
	'@nuitral/types': path.resolve(__dirname, '../types'),
} 

tsconfig.json in dev mode

{
  "compilerOptions": {
    ...
    "paths": {
      "@nuitral/types": [
        "../types/lib"
      ],
      "@nuitral/core": [
        "../core/lib"
      ],
      "@nuitral/theming": [
        "../theming/lib/scss/_index.scss"
      ]
    }
    ...
  }
  ...
}

Progress Status

| Status | Module / Component | Description | |--------|--------------------|------------------------------------| | ✅ | NuitralBox | Box component | | ✅ | NuitralButton | Button component | | ☑️ | NuitralCard | Card component – available in beta | | ☑️ | NuitralChip | Chip component – available in beta | | ✅ | NuitralIcon | Icon component | | ✅ | NuitralInput | Input component | | ✅ | NuitralList | List component | | 🕒 | NuitralSelect | Select component | | ✅ | NuitralTab | Tab component | | ✅ | NuitralTabs | Tabs component |

Component Status Legend

| Icon | Status Description | |------|----------------------------------------------------------------------------| | ✅ | Completed – component is finished and stable | | ☑️ | Available – component is usable but still in beta or under refinement | | 🚧 | In progress – component is being actively developed | | 🕒 | Planned – component is not yet started or scheduled for future development |

Status: Currently in beta version.

License

This project is licensed under the MIT License.

Copyright (c) 2026 Nicola Centonze