index.md

layout	home
title	SoybeanAdmin
titleTemplate	A fresh and elegant admin template
hero	name text tagline image actions SoybeanAdmin Fresh and elegant Based on Vue3,Vite6,TypeScript and UnoCSS src alt /logo.svg SoybeanAdmin theme text link brand Start /guide/quick-start theme text link alt Introduction /guide/intro theme text link alt View on GitHub https://github.com/soybeanjs/soybean-admin
features	icon title details 🆕 The latest technology stack popular in the community. Vue3, Vite6, TypeScript, Pinia, UnoCSS. icon title details 🔄 Multi-framework Support Simultaneously supports Vue3 and React, allowing you to flexibly choose your front-end tech stack. icon title details 🎨 Integration of Multiple Component Libraries Adapts to various component libraries such as Element Plus, Naive UI, Ant Design, and Ant Design Vue to meet diverse UI needs. icon title details 🦋 Clean Structure Use pnpm monorepo, clean and elegant structure, easy to maintain. Very high code specification. icon title details 🛠️ TypeScript Strictly typed, easy for team development and maintenance. icon title details 🔩 Theme Built-in rich theme configuration, easily integrate with UnoCSS. icon title details 🔗 File routing System Automatic, intelligent file routing system. icon title details 🔑 Auth Router Support front-end static routing and back-end dynamic routing. icon title details ⚙️ Extended Script Tools Provides multiple scripting capabilities, including one-click dependency upgrades, automatic generation of ChangeLogs, commit messages, etc., greatly improving development efficiency.

<script setup> import { VPTeamPage, VPTeamPageTitle, VPTeamMembers, VPTeamPageSection } from 'vitepress/theme'; import SbUiPromo from '../.vitepress/theme/SbUiPromo.vue'; const promoCopy = { eyebrow: 'Featured UI', mobileEyebrow: 'Featured UI', description: 'A powerful and elegant component system for Vue 3, combining headless interaction primitives with ready-to-use styled components.', metaItems: ['@soybeanjs/ui', 'Vue 3', '91+ Components'], tags: ['Button', 'Dialog', 'Table'], stats: [ { value: '91+', label: 'Components' }, { value: 'A11y', label: 'Ready' } ], directLinkLabel: 'Open ui.soybeanjs.cn', drawerCloseLabel: 'Close SoybeanUI drawer', siteHint: 'Official site', githubText: 'GitHub', githubHint: 'Source code' }; const partners = [ { avatar: ' https://avatars.githubusercontent.com/u/49704545?v=4', name: 'Soybean', title: 'Author', desc: 'Creator of SoybeanJS team and author of SoybeanAdmin.', links: [ { icon: 'github', link: 'https://github.com/honghuangdc' } ] }, { avatar: ' https://avatars.githubusercontent.com/u/79054161?v=4', name: '青菜白玉汤', title: 'Front-end development · China', desc: 'Responsible for front-end development and maintenance, documentation, community maintenance.', links: [ { icon: 'github', link: 'https://github.com/Azir-11' } ] }, { avatar: 'https://avatars.githubusercontent.com/u/18189346?v=4', name: 'paynezhuang', links: [ { icon: 'github', link: 'https://github.com/paynezhuang' } ] }, { avatar: ' https://avatars.githubusercontent.com/u/35002714?v=4', name: 'fonghehe', desc:'Be keen on new technology, explore the application and practice of new technology, and use it in real projects.', links: [ { icon: 'github', link: 'https://github.com/fonghehe' } ] }, { avatar: 'https://avatars.githubusercontent.com/u/37368500?v=4', name: '我问这瓜保熟吗', links: [ { icon: 'github', link: 'https://github.com/ByteByteBrew' } ] }, { avatar: 'https://avatars.githubusercontent.com/u/43030980?v=4', name: 'yanbowen', links: [ { icon: 'github', link: 'https://github.com/yanbowe' } ] }, { avatar: 'https://avatars.githubusercontent.com/u/53158783?v=4', name: 'lisong', links: [ { icon: 'github', link: 'https://github.com/SonyLeo' } ] }, { avatar: 'https://avatars.githubusercontent.com/u/155351881?v=4', name: 'Ohh', title: 'Front-end development · zhengzhou', links: [ { icon: 'github', link: 'https://github.com/Ohh-889' } ] }, { avatar: 'https://avatars.githubusercontent.com/u/23544762?s=96&v=4', name: '一寸灰', title: 'Front-end development · Beijing', desc: 'Why not', links: [ { icon: 'github', link: 'https://github.com/skyfeiz' } ] }, ] </script> SoybeanJs Team