Alert - Type

The type prop provides 4 default v-alert styles: success, info, warning, and error. Each of these styles provide a default icon and color. The default colors can be configured globally by customizing Vuetify's theme.

Alert - Border

The border prop adds a simple border to one of the 4 sides of the alert. This can be combined props like with color, dark, and type to provide unique accents to the alert.

Alert - Coloured Border

The colored-border prop removes the alert background in order to accent the border prop. If a type is set, it will use the types default color. If no color or type is set, the color will default to the inverted color of the applied theme (black for light and white/gray for dark).

Alert - Density

The density prop decreases the height of the alert based upon 1 of 3 levels of density; default, comfortable, and compact.

Alert - Closable

The closable prop adds a close button to the end of the alert component. Clicking this button will set its value to false and effectively hide the alert

Alert - Icon

The icon prop allows you to add an icon to the beginning of the alert component. If a type is provided, this will override the default type icon. Additionally setting the icon prop to false will remove the icon altogether.

Alert - Outlined

The outlined prop inverts the style of an alert, inheriting the currently applied color, applying it to the text and border, and making its background transparent.

Alert - Prominent

The prominent prop provides a more pronounced alert by increasing the height and applying a halo to the icon. When applying both prominent and dense together, the alert will take on the appearance of a normal alert but with the prominent icon effects.

Alert - Variant

The variant prop provides an easy way to change the overall style of your alerts. Together with other props like density, prominent, border, and shaped, it allows you to create a unique and customized component.



Alert - Rounded

The rounded prop will add or remove border-radius to the alert. Similar to other styled props, rounded can be combined with other props like density, prominent, and variant to create a unique and customized component.