Rosi Ui

screenshot of Rosi Ui

Rosi Ui

💫 一个仍处于构想中的Vue组件库


The RosiUi theme is a beautifully designed set of components for rapid prototyping. Written in TypeScript, it offers on-demand import support and can be easily installed using pnpm or yarn.


  • Beautiful Components - Get access to beautifully designed components out of the box for fast prototyping.
  • TypeScript - RosiUi is built using TSX, making it easier to maintain and work with.
  • Support for on-demand import - Only import the components you need, reducing bundle size and improving performance.


To install RosiUi, you can use either pnpm or yarn. Here are the steps using pnpm:

  1. Open your terminal and navigate to your project directory.
  2. Run the following command to install RosiUi:
pnpm install rosi-ui
  1. Once the installation is complete, you can import RosiUi in your main.ts file:
import RosiUi from 'rosi-ui'
  1. Now, you can use the RosiUi component, such as <r-button>, in your App.vue file:
    <r-button>Click me</r-button>

export default {
  name: 'App',


RosiUi is a theme that offers a range of beautifully designed components for rapid prototyping. It is built using TypeScript, which provides better maintainability and coding experience. With support for on-demand import, you can reduce bundle size and improve the performance of your application. Installation is straightforward, and you can start using the components right away in your Vue projects.


Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects

UI Kits & Components

A UI kit provides developers with a set of reusable components that can be easily integrated into a website or application. These components are pre-designed with consistent styling and functionality, allowing developers to save time and effort in the design and development process. UI kits can be either custom-built or third-party, and often include components for buttons, forms, typography, icons, and more.


ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.


TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.