CSS Reset
Minimal base styles for Vuetify projects.
Edit this page
Copy Page as Markdown
Bootstrapping
Vuetify applies a minimal CSS reset to normalize browser inconsistencies while keeping the footprint small.
The Vuetify style reset is applied globally and affects default elements such as button and input. This also includes anything located outside of the v-app component.
It can be disabled with sass variables by setting $reset: false, but you may have to manually reset some styles for components to display correctly.
Reset Features
Below is a list of styles applied by the reset:
- Apply
box-sizing: border-boxin all elements. - Reset
margininhtmlandbody. - Specify
background-repeat: no-repeatin all elements and pseudo elements. - Inherit
text-decorationandvertical-alignto::beforeand::after. - Reset
border-radiusin input elements. - Specify font inheritance of form elements.
- Apply
cursor: pointerto button elements. - Apply
tab-size: 4inhtml. - Style
cursorby aria attributes. - Minor consitency improvements for search and number inputs.
For a complete list of all applied styles, see the reset stylesheet.
Ready for more?
Continue your learning with related content selected by the Team or move between pages by using the navigation links below.