How to remove padding or margin in Vuetify?

Use the hide-details option: <v-text-field hide-details></v-text-field> to remove the bottom margin, that appears because of the details field used to display details, if available.

use spacing helpers:

class="ma-0" removes margins
class="pa-0" removes padding
class="ma-0 pa-0" removes both

Note that these are also props but only for some (grid) components so for example:
<v-text-field class="pa-0"></v-text-field> will work,
and <v-text-field pa-0></v-text-field> will not work.

Classes are added on top-level element so if in some components you can't remove child-element(s) spacing with these classes, then likely you need to target relevant elements with CSS.

---

To avoid using !important, add custom class on the component and inspect element which you want to edit and then check what's used for targeting it - for example .v-input__slot (we only need highlighted target):

Then replace it like so (custom-text-field is arbitrary custom class applied to the component)

.custom-text-field.v-text-field.v-text-field--enclosed .v-input__slot {
  padding: 0;
}