Versakit is a carefully designed Vue3 component library aimed at providing highly customizable, headless component solutions. It allows developers to build user interfaces without being constrained by specific visual styles, while providing complete control over the appearance and behavior of components.
- 🚀 Provides 30+ high-quality universal components covering forms, navigation, feedback, data display, and more
- 💪 Built entirely on Tailwind CSS, offering elegant default styles with high customizability
- 🎨 Supports headless (unstyled) mode and PT style passing mechanism for flexible component styling
- 🛠️ Supports on-demand importing to optimize application size
- 🌈 Supports theme customization for creating brand-specific UIs
- 🌍 Supports internationalization with built-in Chinese and English language packs
- 💡 Fully developed with TypeScript, providing comprehensive type definitions
- 📚 Detailed documentation and examples for quick onboarding
- 🌙 Native support for dark mode with one-click switching
- ♿ Focus on accessibility design, compliant with WCAG standards
# Using npm
npm install @versakit/vue
# Using yarn
yarn add @versakit/vue
# Using pnpm
pnpm add @versakit/vue
// main.ts
import { createApp } from 'vue'
import App from './App.vue'
import Versakit from '@versakit/vue'
import '@versakit/vue/style'
createApp(App).use(Versakit).mount('#app')
<script setup lang="ts">
import { VButton, VInput } from '@versakit/vue'
import '@versakit/vue/style'
</script>
<template>
<v-input placeholder="Please enter content" />
<v-button>Click Button</v-button>
</template>
Check out our online documentation for more detailed information on component usage, examples, and API references.
# Clone the repository
git clone https://github.com/lenran659/versakit-ui.git
# Install dependencies
pnpm install
# Start the development server
pnpm dev
# Build the component library
pnpm build
# Run tests
pnpm test
Versakit is licensed under the MIT License.