Vue White Dashboard

Vue White Dashboard is a free, open-source admin dashboard template built with Vue.js and Bootstrap 4 that provides over 16 ready-to-use components and pre-built pages for managing and visualizing business data.

What is Vue White Dashboard?

Vue White Dashboard is a Vue.js single-page application starter built on Bootstrap 4 that outputs a fully styled admin panel with dashboard, user profile, table, map, notifications, typography, and icon pages. It takes a fresh Vue project as input and produces a functional UI kit with global component registration, a router, and SASS theming. The project is created and maintained by Creative Tim and is licensed under MIT.

Key Features

Vue White Dashboard ships with more than 16 individual components and two color modes, and it is styled entirely with SASS on top of Bootstrap 4.

• Component library — Includes BaseAlert, BaseButton, BaseCheckbox, BaseNav, BaseRadio, BaseTable, Dropdown, Modal, CloseButton, NavbarToggleButton, and SidebarPlugin, which can be combined into thousands of layout variations.
• Dark and Light modes — Both color schemes are included out of the box and can be customized through SASS variables in src/assets/scss.
• Pre-built pages — Dashboard, User Profile, Tables, Maps, Notifications, Typography, and Icons pages are included, each mapped via router.js; an RTL page is available through the enableRTL query parameter.
• Internationalization — An i18n.js setup and a locales directory are included, enabling multi-language support.
• SASS theming — Colors and component variations are defined in the white-dashboard.scss file and the scss/white-dashboard folder, so branding changes stay in one place.
• Browser support — Officially supports the last two versions of Chrome, Firefox, Edge, Safari, and Opera.
• One-click deploy — A deploy button pushes the template to Genezio without manual configuration.
• MIT license — Free for personal and commercial use, with copyright held by Creative Tim.

Who is it for?

Vue White Dashboard is aimed at developers and teams that need a polished admin front end without building UI components from scratch.

• Frontend developers — Use the pre-configured Vue project with imported components and a routing system to start an admin dashboard in minutes.
• Startups and small businesses — Display KPIs, tables, and location data on the ready-made Dashboard page.
• Design agencies — Rebrand the dashboard by adjusting SASS variables to match client colors and delivering a white or dark theme.

What can you do with Vue White Dashboard?

These concrete tasks are supported by the pages and components included in the template.

• Product managers: track business metrics on the Dashboard page with charts and cards.
• Support teams: manage user notifications and alerts via the Notifications page.
• Data analysts: present tabular data on the Tables page and plot geographic information on the Maps page.

How does Vue White Dashboard work?

Clone the repository from GitHub, install the npm dependencies from package.json, and launch the development server. The router.js file maps each pre-built page to its route, while globalComponents.js registers base components such as buttons, alerts, and tables automatically, so you can use them anywhere in your templates.

FAQ

Is Vue White Dashboard free?

Yes, it is released under the MIT license, allowing free use in personal and commercial projects.

Does Vue White Dashboard include dark mode?

Yes, the template ships with both Dark Mode and Light Mode, configurable through SASS.

What browsers does Vue White Dashboard support?

It officially supports the last two versions of Chrome, Firefox, Edge, Safari, and Opera.

How many components are included?

The dashboard includes over 16 individual components, including buttons, alerts, tables, dropdowns, modals, and a sidebar plugin.

Can I deploy Vue White Dashboard easily?

Yes, a one-click deploy button is provided for Genezio, in addition to the standard GitHub download.