A Vue3 component library based on Material Design 2 and 3, supporting mobile and desktop.
version stars vue license coverage
Varlet is a Vue3 component library based on Material Design 2 and 3, supporting mobile and desktop, developed and maintained by varletjs organization.
varlet.js contain all the styles and logic of the component library, and you can import them.
<div id="app"></div> <script src="https://cdn.jsdelivr.net/npm/vue"></script> <!-- Desktop Adaptation --> <script src="https://cdn.jsdelivr.net/npm/@varlet/touch-emulator/iife.js"></script> <script src="https://cdn.jsdelivr.net/npm/@varlet/ui/umd/varlet.js"></script> <script> const app = Vue.createApp({ template: '<var-button>Button</var-button>' }) app.use(Varlet).mount('#app') </script>
# Install with npm or yarn or pnpm # npm npm i @varlet/ui -S # yarn yarn add @varlet/ui # pnpm pnpm add @varlet/ui
import App from './App.vue' import Varlet from '@varlet/ui' import { createApp } from 'vue' import '@varlet/ui/es/style' createApp(App).use(Varlet).mount('#app')
The following projects are maintained by the official team for a long time.
| Name | Description | |||
|---|---|---|---|---|
| @varlet/touch-emulator | Desktop adapter, so that the mobile component library can run on the desktop |
|||
| @varlet/import-resolver |
A resolver for @varlet/preset-unocss |
@varlet/preset-tailwindcss | varlet-theme-builder | Theme generator for generating theme variables for varlet Material Design 3 |
| vscode-theme-varlet | Varlet VSCode Theme |
|||
| varlet-install-example | Case collection of Varlet component library and various ecosystem integration |
The following projects are maintained by community personnel, welcome to add.
| Name | Description |
|---|---|
| create-vite-app | A desktop template scaffolding based on Vue3, providing desktop presets for Varlet component library |
| vue3-varlet-mobile | A mobile template based on Vue 3 and Varlet Component Library |
See Thanks to contributors Thanks to the following sponsors Sponsor this project
Sponsor this project to support our better creation.