Introduction to the

Naive Ui Admin is based on Vue3, Vite2,TypeScript, and uses Naive Ui component libraries to form an out-of-the-box solution for the middle and back end. Naive Ui Admin adheres to the design and development conventions of Naive Ui components, with a unified style. Comprehensive components and convenient tools will make it easy for you to work at your fingertips, with more features on the way.

Pro, appearance level so high, can give a Star to encourage the developer?, tract,

Naive Ui Admin GitHub

The online preview

Online access address Password Enter any password (screen lock password is also included)


  • Latest technology stack: developed using front edge technologies such as Vue3/ Vite2
  • TypeScript: The language for application-level JavaScript
  • Topic: A configurable topic
  • Mock Data Built-in Mock data scheme
  • Permission Built-in complete dynamic routing permission generation scheme
  • Component Encapsulates commonly used components


  • ✨ the Features

  • Menu Mode (left/top)
  • Permissions (fixed role/dynamic routing menu)
  • Theme (dark/light) reference Naiveui features, dark theme/custom components, dark theme is easy to pinch
  • System theme (10 safe colors, toggle preview, customizable)
  • Navigation style (3, can match freely, dark side/white side and banner/dark side and top banner)
  • Multi-tab, persistent, drag and drop, close, fixed, adaptive scrolling left and right
  • Bread crumbs, ICONS, sub – menu drop-down linkage display
  • Nice lock screen interface
  • Online drawer configuration (Layout Preview)
  • Master console, I wrote it down briefly. I can read it
  • The workbench is randomly stroked (don’t want to write style) with tailwindcss
  • Echarts, the official website is very full of examples, nothing good wanking
  • Main console, workbench, adaptive support
  • Left menu screen visible width <=950
  • Whether the footer is displayed is configurable
  • Add page cache, demo page > Workbench > Dynamic Card > input box


  • [x] Nice lock screen
  • [x] Digital animation
  • [x] Basic table
  • [x] Upload the image
  • [x] Slider verification code
  • Ongoing development…

Results show

  • The login

  • Master station

  • The workbench

  • Menu permissions

  • Role authorization

  • Forms/Details

  • Lock screen

  • Project configuration

  • The dark theme

Wow, you can see this. Click firstStarEncourage the developers, thanks! ◠ ‿ ◠

Update log