Admin One - Vue.js 3 Tailwind CSS admin dashboard template

Overview

Admin One — Free Vue.js 3 Tailwind Admin Dashboard

version license

Free Tailwind CSS admin dashboard

Admin One is simple, beautiful and free Vue.js 3 Tailwind CSS admin dashboard

  • Free under MIT License
  • Built with Vue.js 3 & Tailwind CSS Framework
  • Vuex & Router
  • Composition API
  • Reusable components

Premium version is coming soon

Table of Contents

Other versions

This is Vue.js 3 Tailwind CSS admin dashboard version

Tailwind CSS admin dashboard templates
Tailwind admin dashboard
Pure HTML/CSS

Free
Tailwind admin dashboard
Vue.js 3

Free

Demo

Free Dashboard Demo

https://justboil.github.io/admin-one-vue-tailwind/

Quick Start

Get the repo

Project setup

cd to project's dir and run npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Lints and fixes files

npm run lint

Browser Support

We try to make sure Dashboard works well in the latest versions of all major browsers

Chrome Firefox Edge Safari Opera

Reporting Issues

JustBoil's free items are limited to community support on GitHub.

The issue list is reserved exclusively for bug reports and feature requests. That means we do not accept usage questions. If you open an issue that does not conform to the requirements, it will be closed.

  1. Make sure that you are using the latest version of the Dashboard. Issues for outdated versions are irrelevant
  2. Provide steps to reproduce
  3. Provide an expected behavior
  4. Describe what is actually happening
  5. Platform, Browser & version as some issues may be browser specific

Licensing

Useful Links

Comments
  • How to install with Laravel Inertia Stack??

    How to install with Laravel Inertia Stack??

    Hi, I'm sry if this is a noob question.

    I've just got into the Laravel Inertia Stack. I'm trying to create a template which I can use in my future projects.

    • I created a new project with laravel 9. I installed Laravel Breeze with vue option.
    • I then made an admin side, using laravel breeze templates and have made sure all the functionalities (Login/Logout, forget password, etc) are working.
    • The structure is
    • ~/resources/js/Pages/Backend/ contains all the backend pages
    • ~/resources/js/Pages/Frontend/ contains all the frontend pages
    • ~/resources/js/Pages/Components/ contains all the individual components

    I want to install the admin-one dashboard into my project now. Can someone please help?

    opened by bhaviljain68 5
  • can not run nuxtjs version

    can not run nuxtjs version

    opened by MHKarami97 4
  • Changing @vue/cli-service

    Changing @vue/cli-service": "^4.5.13 version in package.json , getting bellow error when running npm run install

    npm run serve

    [email protected] serve C:\Users\NarayanaReddyAnnapur\git\Digi\digihome-ui vue-cli-service serve

    INFO Starting development server... WARN A new version of sass-loader is available. Please upgrade for best experience. 98% after emitting CopyPlugin

    ERROR Failed to compile with 1 error 7:11:19 PM error in ./src/css/main.css

    Syntax Error: Error: PostCSS plugin tailwindcss requires PostCSS 8. Migration guide for end-users: https://github.com/postcss/postcss/wiki/PostCSS-8-for-end-users

    @ ./src/css/main.css 4:14-162 15:3-20:5 16:22-170 @ ./src/main.js @ multi (webpack)-dev-server/client?http://192.168.0.6:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

    Could you please help on this issue , thank you in Advance. 1

    opened by ac01741 3
  •  The requested module '/node_modules/.vite/vue.js?v=6e305727' does not provide an export named 'default'

    The requested module '/node_modules/.vite/vue.js?v=6e305727' does not provide an export named 'default'

    when using Axios intercept request and response-interceptors api request like below

    import network from './request.js' export const UserLogin = (data) => { return network({ url: '/opt', method: 'post', data }) }

    opened by myomyintaung1411 2
  • ReferenceError: RouterLink is not defined in NavBarItem.vue in Laravel integration

    ReferenceError: RouterLink is not defined in NavBarItem.vue in Laravel integration

    When following the Laravel 9 integration guide, you get this error:

    Uncaught (in promise) ReferenceError: RouterLink is not defined at ReactiveEffect.fn (NavBarItem.vue:26:5) at ReactiveEffect.run (reactivity.esm-bundler.js:185:25) at get value [as value] (reactivity.esm-bundler.js:1147:39) at unref (reactivity.esm-bundler.js:1053:29) at Object.get (reactivity.esm-bundler.js:1056:37) at Proxy._sfc_render (NavBarItem.vue:97:10) at renderComponentRoot (runtime-core.esm-bundler.js:888:44) at ReactiveEffect.componentUpdateFn [as fn] (runtime-core.esm-bundler.js:5600:57) at ReactiveEffect.run (reactivity.esm-bundler.js:185:25) at instance.update (runtime-core.esm-bundler.js:5714:56)

    The solution is change line 26 of "resources/js/Components/NavBarItem.vue" replacing "RouterLink" component from vue-router module with "Link" component form inertia-vue3 module.

    resources/js/Components/NavBarItem.vue 26 - return RouterLink; 26 + return Link;

    opened by tfrazzet 1
  • Missing module

    Missing module "@tailwindcss/line-clamp" in Laravel integration

    When following the Laravel 9 integration guide, you get this error:

    Cannot find module '@tailwindcss/line-clamp'

    Require stack:

    • /home/tommaso/Progetti/Www/app.mezzanato.it/www/tailwind.config.js
    • /home/tommaso/Progetti/Www/app.mezzanato.it/www/node_modules/tailwindcss/lib/lib/setupTrackingContext.js
    • /home/tommaso/Progetti/Www/app.mezzanato.it/www/node_modules/tailwindcss/lib/index.js
    • /home/tommaso/Progetti/Www/app.mezzanato.it/www/postcss.config.js Plugin: vite:css File: /home/tommaso/Progetti/Www/app.mezzanato.it/www/resources/css/main.css at Module._resolveFilename (node:internal/modules/cjs/loader:955:15) at Module._load (node:internal/modules/cjs/loader:803:27) at Module.require (node:internal/modules/cjs/loader:1021:19) at require (node:internal/modules/cjs/helpers:103:18) at Object. (/home/tommaso/Progetti/Www/app.mezzanato.it/www/tailwind.config.js:82:9) at Module._compile (node:internal/modules/cjs/loader:1119:14) at Module._extensions..js (node:internal/modules/cjs/loader:1173:10) at Module.load (node:internal/modules/cjs/loader:997:32) at Module._load (node:internal/modules/cjs/loader:838:12) at Module.require (node:internal/modules/cjs/loader:1021:19)

    The solution is install module via npm:

    npm install @tailwindcss/line-clamp --save-dev

    opened by tfrazzet 1
  • How to fix this issue - stats.children: true

    How to fix this issue - stats.children: true

    After running command - npm run dev, i got this warning alert below:

    3 WARNINGS in child compilations (Use 'stats.children: true' resp. '--stats-children' for more details)
    webpack compiled with 3 warnings
    

    Any fix to this issue?

    opened by ljsharp 1
  • The engine

    The engine "node" is incompatible with this module. Expected version "8 || 10 || 12 || 14 || 16 || 17". Got "18.0.0"

    $ yarn yarn install v1.22.18 info No lockfile found. [1/4] Resolving packages... [2/4] Fetching packages... error @achrinza/[email protected]: The engine "node" is incompatible with this module. Expected version "8 || 10 || 12 || 14 || 16 || 17". Got "18.0.0" error Found incompatible module. info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.

    opened by erycamel 1
  • Fix the vulnerabilities.

    Fix the vulnerabilities.

    Upgrade the package.json to resolve vulnerabilities.

    Currently there is 70 vulnerabilities:

    120 packages are looking for funding
      run `npm fund` for details
    
    70 vulnerabilities (57 moderate, 13 high)
    
    To address issues that do not require attention, run:
      npm audit fix
    
    Some issues need review, and may require choosing
    a different dependency.
    
    Run `npm audit` for details.
    

    Ran npm audit fix and npm audit fix --force doesn't fix those vulnerabilities.

    opened by andylow 1
  • Suggestion: Make use of .env for configuration

    Suggestion: Make use of .env for configuration

    First of all, thank you for an awesome template. It would be nice if we could make use of .env files for some configurations such as default document title etc. All that is need to do is make sure they are saved as VITE_ in a .env file as per documenation

    opened by garikaib 0
  • vue router prefix #

    vue router prefix #

    Hi everyone I have a problem about vue router prefix which contain # on the route. I need to integrate with a call back service which only allow url without# how do I get rid of # prefix ?

    eg. http://localhost:8080/#/

    http://localhost:8080/?code=VhLquPYa70tCmdvdoW87hm&state=638700c043d95e002feaeed0#/

    I can not get the params from the route

    opened by kengketa 0
Releases(v3.1.0)
  • v3.1.0(Dec 5, 2022)

    Admin One is fast and free Vue.js 3 TailwindCSS admin dashboard. Vite or Nuxt 3 or Laravel.

    Changelog

    • Improve component logic
    • Other minor updates

    Full Changelog: https://github.com/justboil/admin-one-vue-tailwind/compare/v3.0.0...v3.1.0

    Source code(tar.gz)
    Source code(zip)
  • v3.0.0(Aug 2, 2022)

    Admin One is fast and free Vue.js 3 TailwindCSS admin dashboard. Vite or Nuxt 3 or Laravel.

    Changelog

    • New design
    • New component names (Vue code style conventions)
    • Remove vue-cli. Vite is now default.
    • Update Laravel guide
    • Update Nuxt 3 guide
    • Logic and style updates
    • Other minor updates

    Full Changelog: https://github.com/justboil/admin-one-vue-tailwind/compare/v2.2.0...v3.0.0

    Source code(tar.gz)
    Source code(zip)
  • v2.2.0(May 4, 2022)

    Admin One is simple, beautiful and free Vue.js 3 TailwindCSS admin dashboard. Vite and Vue CLI build tools.

    Changelog

    • Upd: vue-services to ^5.0.0
    • Add: Laravel Jetstream Inertia + Vue.js guide
    • Add: Pinia store (official Vuex 5)
    • Apd: packages
    • Other updates

    Full Changelog: https://github.com/justboil/admin-one-vue-tailwind/compare/v2.1.0...v2.2.0

    Source code(tar.gz)
    Source code(zip)
  • v2.1.0(Feb 6, 2022)

    Admin One is simple, beautiful and free Vue.js 3 TailwindCSS admin dashboard. Vite and Vue CLI build tools.

    Changelog

    • Add: switchable styles (+white style)
    • Upd: dark mode colors
    • Other updates

    Full Changelog: https://github.com/justboil/admin-one-vue-tailwind/compare/v2.0.0...v2.1.0

    Source code(tar.gz)
    Source code(zip)
  • v2.0.0(Dec 14, 2021)

    Admin One is simple, beautiful and free Vue.js 3 TailwindCSS admin dashboard. Vite and Vue CLI build tools.

    Changelog

    • Update Tailwind to 3.x version
    • Update linter settings
    • Implement custom scrollbars without 3rd-party package
    • Other minor updates
    Source code(tar.gz)
    Source code(zip)
  • v1.4.0(Nov 29, 2021)

    Admin One is simple, beautiful and free Vue.js 3 TailwindCSS admin dashboard. Vite and Vue CLI build tools.

    Changelog

    • Add SFC <script setup> Info
    • Updated eslint configs
    • Code style updates
    • Minor CSS style updates
    Source code(tar.gz)
    Source code(zip)
  • v1.3.3(Nov 27, 2021)

    Admin One is simple, beautiful and free Vue.js 3 TailwindCSS admin dashboard. Vite and Vue CLI build tools.

    Changelog

    • Add Vite build tools (Vue CLI is also available)
    • Add ctrl+k focus on search bar
    • Upd colors.js logic
    • Add disabled state on jb-button component
    • Add dark mode persist via localStorage
    • Other fixes & improvements
    Source code(tar.gz)
    Source code(zip)
  • v1.3.0(Oct 5, 2021)

    Admin One is simple, beautiful and free Vue.js 3 Tailwind CSS admin dashboard with dark mode

    Changelog

    • New components
    • Dark mode
    • Styled scrollbar
    • Other minor fixes and improvements
    Source code(tar.gz)
    Source code(zip)
  • v1.2.1(Aug 12, 2021)

    Admin One is simple, beautiful and free Vue.js 3 Tailwind CSS admin dashboard

    Changelog

    • Added responsive screenshots page (mobile and tablet, small laptops, laptops and desktops)
    • Component fixes
    • Other minor improvements
    Source code(tar.gz)
    Source code(zip)
  • v1.2.0(Jul 19, 2021)

    Admin One is simple, beautiful and free Vue.js 3 Tailwind CSS admin dashboard

    Changelog

    • Improved responsiveness
    • New components & upgraded existing
    • Less css
    • Less dependenices
    • Other minor improvements
    Source code(tar.gz)
    Source code(zip)
  • v1.1.0(Jun 16, 2021)

    Admin One is simple, beautiful and free Vue.js 3 Tailwind CSS admin dashboard

    Changelog

    • Removed moment.js from chart.js to minimize bundle
    • Removed mdi font from index.html. Now icons are rendered using svg from @mdi/js with new Icon component
    • Other style fixes
    Source code(tar.gz)
    Source code(zip)
  • v1.0.0(Jun 15, 2021)

    Admin One is simple, beautiful and free Vue.js 3 Tailwind CSS admin dashboard

    • Free under MIT License
    • Built with Vue.js 3 & Tailwind CSS Framework
    • Vuex & Router
    • Composition API
    • Reusable components

    Premium version is coming soon

    Source code(tar.gz)
    Source code(zip)
Owner
JustBoil.me
Tailwind CSS / Vue.js 3 / Bulma dashboard templates
JustBoil.me
Windzo a free open source dashboard admin template, using vue js and tailwind css framework

Windzo Dashboard Admin this dashboard app on development fork this repo for new commit update ?? Windzo is a free open source dashboard admin template

Mohammad Sahrullah 39 Nov 25, 2022
🚀🚀🚀vue3,vue3.0,vue,vue3.x,vue.js,vue后台管理,admin,vue-admin,vue-element-admin,ant-design,vue-admin-beautiful-pro,vab admin pro,vab admin plus主线版本基于element-plus、element-ui、ant-design-vue三者并行开发维护,同时支持电脑,手机,平板,切换分支查看不同的vue版本,element-plus版本已发布(vue3,vue3.0,vue,vue3.x,vue.js)

??????vue3,vue3.0,vue,vue3.x,vue.js,vue后台管理,admin,vue-admin,vue-element-admin,ant-design,vue-admin-beautiful-pro,vab admin pro,vab admin plus主线版本基于element-plus、element-ui、ant-design-vue三者并行开发维护,同时支持电脑,手机,平板,切换分支查看不同的vue版本,element-plus版本已发布(vue3,vue3.0,vue,vue3.x,vue.js)

good luck 13.4k Jan 1, 2023
Dashboard starter template built with Vite, Vue 3, Tailwind CSS and TypeScript.

Dashboard starter template built with Vue 3 and Tailwind CSS.

Robert Soriano 766 Dec 19, 2022
Courses Dashboard Template Build with Tailwind CSS, vite, vue 3, and chart.js shapes with RTL Languages Support.

Courses Dashboard Template Courses Dashboard Template Build with Tailwind CSS, vite, vue 3, and chart.js shapes with RTL Languages Support. Resources

Meraki UI 9 Jan 2, 2023
Admin dashboard based on paper dashboard UI template + vue-router

Creative Tim Paper Dashboard made for Vue

Creative Tim 1.8k Dec 16, 2022
Tailmin - Admin dashboard built with Vue.js and Tailwind CSS

Tailmin Admin Dashboard Template - Live Demo Admin dashboard built with Vue.js and Tailwind CSS Usage Clone this repository Run npm install to install

Seto Kuslaksono 43 Dec 9, 2022
Nuxewind - Open Source Vue JS (Nuxt) Tailwind Admin Dashboard Template

Installation Clone this repository git clone https://github.com/zuramai/nuxewind

Ahmad Saugi 66 Nov 30, 2022
Free Vue.js 3.x Tailwind 3.x admin dashboard template with dark mode. Vite builds. Pinia state. Laravel integration available

Admin One — Free Vue 3.x Tailwind 3.x Admin Dashboard with dark mode Tailwind 3.x Vue 3.x with Vite or Nuxt or Laravel Tailwind 3.x Vue 3.x with Vite

AceInfoTech Mihir 3 Nov 1, 2022
🚀🚀🚀Vue3,Vue3.0,Vue,Vue3.x,Vuex,Typescript,TSX,ts,vue后台管理,admin,vue-admin,vue3-admin,vue-element-admin,iooc-admin,iooc-vue-admin主线版本基于element-plus、Typescript开发维护.集成CRUD,JsonSchema、大量节省业务代码.

iooc-admin(element-plus) 演示地址(数据库五分钟重置一次) ⚡️ vue3.x + element-plus + TypeScript ⚡️ vue3.x + element-plus + TypeScript (视频) 项目地址 ⚡️ vue3.x + element-pl

Jacking 51 Jun 20, 2021
Star Admin Vue Admin Template is a free admin template based on Bootstrap 4 and Vue.js.

Star Admin Vue Admin is a free admin template based on Bootstrap 4 and Vue.js.

BootstrapDash 310 Dec 25, 2022
ControlLlamadasWeb - Admin One - Free Vue Bulma Dashboard

Admin One — Free Vue Bulma Dashboard Admin One is simple, beautiful and free Vue

null 1 Mar 2, 2022
Vumin is a Free Admin Template built with Vue.js & Tailwind CSS.

Vumin is a Free Admin Template built with Vue.js & Tailwind CSS. Highlights SPA (Single Page Application) Reusable Components Vue Router & VueX Suppor

ScriptMint Solution 18 Dec 6, 2022
Vuejs-dashboard - A dashboard template with VueJS and Fastify

VueJS dashboard template (api & client) A simple dashboard template using MongoD

DEVIOO 6 Jul 13, 2022
Agency Landing page Template Build with Tailwind CSS, vite, and vue 3, shapes with RTL Languages Support.

Agency Landing page Template Build with Tailwind CSS, vite, and vue 3, shapes with RTL Languages Support.

Meraki UI 8 Nov 9, 2022
A free Vue admin dashboard template pack featuring a modern design system and lots of custom templates and components.

Shards Dashboard Vue A free Vue admin dashboard template pack featuring a modern design system and lots of custom templates and components. ✨ Note: Yo

DesignRevision 386 Dec 30, 2022
Admin dashboard template with vue 2.0

Admin dashboard template with vue 2.0

Andrew Li 1 Sep 24, 2021
Free Vue.js Bulma Buefy Admin Dashboard Template

Admin One — Free Vue Bulma Buefy Dashboard Admin One is simple, beautiful and free Vue.js 2.x Buefy Bulma admin dashboard (SPA/PWA). Free under MIT Li

Viktor Kuzhelny 197 Jan 1, 2023
Vue.js admin dashboard template built with Bootstrap 4.5

Sing App Vue Dashboard - free and open source admin dashboard template Including responsive layout and high quality UI built with Bootstrap 4.5. View

Flatlogic 652 Dec 29, 2022
Vue admin dashboard template with stylish transparent design

?? Vue admin dashboard template with stylish transparent design Free and open-source admin dashboard template built with Vue.js and Bootstrap 4.5. Dev

JaeYun 2 Nov 28, 2021