How to change font size in Vuetify based on viewport?

Sometimes, we want to change font size in Vuetify based on viewport.

In this article, we’ll look at how to change font size in Vuetify based on viewport.

How to change font size in Vuetify based on viewport?

To change font size in Vuetify based on viewport, we can apply Vuetify font size classes based on the breakpoint.

For instance, we write

``````<template>
<div>
to set the div’s class to `subheading` when the breakpoint is `xs` or higher by setting `subheading` to `\$vuetify.breakpoint.xs`.