lh-ui-plusEnterprise-grade Vue 3 Component Library

Beauty of tradition, foundation of code. Blending traditional Chinese aesthetics with modern engineering practices.

🎨

Chinese Aesthetic Design

Inspired by traditional ink wash painting, featuring indigo primary, cinnabar highlights, and rice paper textures for an elegant Eastern aesthetic experience.

🧩

Framework-agnostic Architecture

Core pure function logic decoupled from any framework, seamlessly accessible from Vue 3, React, or Vue 2.

⚡

TypeScript Powered

Full-stack TypeScript type inference, providing complete type safety and IDE intelligent suggestions.

🛠️

Deep Customization

CSS variable theme system, sx quick layout, and pattern background support to meet various design requirements.

🌍

Internationalization

Built-in ConfigProvider configuration system, supporting multi-language and global theme management.

📦

On-demand Loading

Tree-shaking support, import only the components you need, minimizing bundle size.

Quick Start

            
              # Install
                npm install @lh-ui/vue3
              # Usage
              import { LhButton, LhInput } from '@lh-ui/vue3'
              import '@lh-ui/vue3/dist/index.css'

🎨

Chinese Aesthetic Design

源自传统水墨丹青 — indigo primary, cinnabar accents, rice-paper base

CSS VariablesDark Mode

🧩

Framework-agnostic Architecture

Framework-decoupled pure-function core — plug into Vue 3, React, or Vue 2

TypeScriptPure Logic

🌊

Pattern Backgrounds

Six guofeng patterns — 柳叶 willow · 祥云 cloud · 波浪 wave · 雪花 snow · 梅花 plum · 竹节 bamboo

bg-pattern6 Presets

🌍

Internationalization

Built-in ConfigProvider system for unified multi-language management

i18n9 Languages

Theme Presets

青花瓷

Ceramic Blue

松花绿

Pine Green

朱砂

Vermilion

水墨

Ink Wash

藤黄

Golden Autumn

Component Overview

Basic 2

Button Button Icon Icon

Form 11

Input Input InputNumber InputNumber Select Select Checkbox Checkbox Radio Radio Switch Switch Slider Slider DatePicker DatePicker TimePicker TimePicker Cascader Cascader Form Form

Data Display 6

Tag Tag Badge Badge Avatar Avatar Progress Progress Statistic Statistic Descriptions Descriptions

Layout 3

Divider Divider Space Space Card Card

Navigation 4

Breadcrumb Breadcrumb Pagination Pagination Tabs Tabs Steps Steps

Configuration 1

ConfigProvider ConfigProvider