Change default font in vuetify

Question

I can\'t figure out how to change the default font in vuetify. I\'ve been looking for the right variable within ./node_modules/vuetify, but I can\'t locate it.

I\'d

Answer 1

My solution in (latest) Nuxt:

nuxt.config:

head: {
.......
link: [
  {rel: 'icon', type: 'image/x-icon', href: '/favicon.ico'},
  {
    rel: 'stylesheet',
    href:'https://fonts.googleapis.com/css?family=Raleway:400|Roboto+Slab:200&display=swap'
  }
]
},

vuetify: {
treeShake: true,
customVariables: ['~/assets/variables.scss'],

theme: {
  .....
  },
}
},

variables.scss

$body-font-family: Raleway, sans-serif;
$heading-font-family: Roboto Slab, serif;

@import '~vuetify/src/styles/styles.sass';