What is Artivue?

Layered themes made easy

Artivue is a Vue.js plugin designed to streamline and enhance the process of theming in Vue applications. It offers a set of tools and features that allow developers to easily create, manage, and apply dynamic and layered themes across their projects.

With Artivue, handling themes becomes an intuitive and integrated part of the development process, freeing developers to focus on creating exceptional user experiences without getting bogged down by the complexities of CSS and styling conventions.

Installation

pnpm

pnpm add artivue

yarn

yarn add artivue

npm

npm install artivue

Then, install add the plugin in your entry file

// main.ts
import { createApp } from 'vue'
import { createArtivue } from 'artivue'
import App from './App.vue'

import './styles/main.css'

const artivuePlugin = createArtivue()

const app = createApp(App)
app.use(artivuePlugin)
app.mount('#app')

You can optionally specify the initial theme to use, either by using a provided theme

import { createArtivue, themes } from 'artivue'

const artivuePlugin = createArtivue({ theme: themes.dark })

Or with your own definitions

const artivuePlugin = createArtivue({
  theme: {
    surface: {
      background: '#191A23',
      text: '#ffffff',
    },
    accent: {
      background: '#2b6be3',
      text: '#ffffff',
    }
  }
})