Comment utiliser les couleurs dans Vuetify

Question

Je sais que je peux importer des couleurs pour pouvoir utiliser Deepen purple Lighten-4 dans JS. Comment le ferais-je dans la section consacrée à Vuetify ci-dessous? Dois-je ajouter un Vue.use(colors)?

import Vue from 'vue'
import Vuetify from 'vuetify'
import 'vuetify/dist/vuetify.css'
import colors from 'vuetify/es5/util/colors'

import App from './App'
import router from './router'

Vue.use(Vuetify, { theme: {
  primary: '#ee44aa',
  secondary: '#424242',
  accent: '#82B1FF',
  error: '#FF5252',
  info: '#2196F3',
  success: '#4CAF50',
  warning: '#FFC107'
}})

Vue.config.productionTip = false

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  render: h => h(App)
})

Answer 1

De la docs :

import Vue from 'vue'
import Vuetify from 'vuetify'
import colors from 'vuetify/es5/util/colors'

Vue.use(Vuetify, {
  theme: {
    primary: colors.blue.darken4,
    secondary: colors.amber.lighten2
  }
})

Toute couleur de thème que vous ne spécifiez pas dans l'objet de thème se voit simplement attribuer sa valeur par défaut par Vue.

Answer 2

utilisez simplement le color = "" <- puis votre couleur désirée ex.

<v-btn color="success">Success</v-btn>

voici mon exemple de stylo pour plus d'exemple

https://codepen.io/pen/?editors=1010