Press "Enter" to skip to content

A Minimalist Dark Design System for Vue.js | vuedarkmode

vuedarkmode is a modern and very small UI component library that helps you easily create darkly designed Vue.js applications.

vue dark mode, vuetify dark mode, vue tailwind dark mode, vue a11ydark mode, vuetify theme cache, vue theme, buefy dark mode, vuetify dark mode toggle

Components included:

Alert

  • Avatar
  • Badge
  • Button
  • Divider
  • Heading
  • Icon
  • ProgressBar
  • Spinner
  • Toast
  • Checkbox
  • ImageUploader
  • Input
  • InputNumber
  • Radio
  • Select
  • Tabs
  • Textarea
  • Toggle

How to make use of it:

Install & Download:

npm install @growthbunker/vuedarkmode

# Or if you prefer using yarn
yarn add @growthbunker/vuedarkmode

1. In your main.js file:

import Vue from "vue"
import VueDarkMode from "@growthbunker/vuedarkmode"

Vue.use(VueDarkMode)

2. Create a new plugin in plugins/vuedarkmode.js:

import Vue from "vue"
import VueDarkMode from "@growthbunker/vuedarkmode"

Vue.use(VueDarkMode)

3. Add this new plugin to nuxt.config.js.

module.exports = {
  // ...
  plugins: [{ src: "@/plugins/vuedarkmode.js" }];
}

4. Get the latest version from jsdelivr, and import the JavaScript file to your page.

<script src="https://cdn.jsdelivr.net/npm/vue@2.5/dist/vue.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@growthbunker/vuedarkmode@latest/dist/vuedarkmode.min.js"></script>

buefy-dark-mode-checkbox

light-mode-ui-tabs

vue-dark-mode

vuedarkmode-image-upload

vue-dark-mode-toggles

vue-tailwind-dark-mode-icons

vue-theme

vuetify-dark-mode

vuetify-theme-toasts

dark ui component library, vuedarkmode Plugin/Github


See Demo And Download

Official Website(LeCoupa): Click Here

This superior jQuery/javascript plugin is developed by LeCoupa. For extra advanced usage, please go to the official website.

Be First to Comment

    Leave a Reply

    Your email address will not be published.