How to use other font family in Vuetify 3

1. First of all install sass in your vue js project:

> yarn add sass

2. Now create a sass file (lets say main.scss) in your vue js project and add the following code in that sass file:

@use 'vuetify' with (
   $body-font-family: cursive /*put the font family name here*/
);

3. Assign font family name to Vuetify sass variable $body-font-family as shown in the step 2:

4. Import that sass file in entry file of your vue js project (main.js or main.ts):

import '@/assets/main.scss';

5. That’s it, now your vue js project would use custom font family in the Vuetify. Vuetify by default uses Roboto font family.

6. I assume that you already know how to add fonts in the project.