Vue.js - Vuetify how to get rounded corners on cards?

v-card has rounded corners by default. It does not provide a prop named round to make it have more rounded corners.

If you want to have more rounded corners as compared to the default then add a custom css class to v-card

<v-card class="rounded-card">

css

.rounded-card{
    border-radius:50px;
}

Here is a codepen

I would like to update Vamsi Krishna's answer. Vuetify now provides since v2.3 border utilities to quickly style the border-radius of any element.

To minimize custom CSS and make your Vue app more consitent, you may now use .rounded-xs, .rounded, .rounded-lg or .rounded-xl classes as specified in the docs:

<v-card class="rounded-lg">