Changing the Vuetify carousel height

You can set auto height of it:

<v-carousel height="auto">

In your main vue component or in the component where you have the v-carousel add a css rule:

.carousel {
  height: 200px !important;
}

• Add !important if it's not working without it

• If you're putting this rule in the main component make sure the <style> tag doesn't have the word scoped in it

There's no need to use CSS neither important on it. You can use one prop to change the height:

Name: height

Default: 500

Type: number | string Sets the component height

Eg.

  <v-carousel height="500px">
    <v-carousel-item
      v-for="(item,i) in items"
      :key="i"
      :src="item.src"
    ></v-carousel-item>
  </v-carousel>