Documentation
Documentation Hub

Start tabs

Tabs can have different alignments. Use the justify prop to display tabs aligned to the left, center or right.

TeamProjects

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quid iudicant sensus? Primum quid tu dicis breve? Etiam beatissimum? Ne discipulum abducam, times.

Show code

Center tabs

Tabs can have different alignments. Use the justify prop to display tabs aligned to the left, center or right.

TeamProjects

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quid iudicant sensus? Primum quid tu dicis breve? Etiam beatissimum? Ne discipulum abducam, times.

Show code

End tabs

Tabs can have different alignments. Use the justify prop to display tabs aligned to the left, center or right.

TeamProjectsTasks

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quid iudicant sensus? Primum quid tu dicis breve? Etiam beatissimum? Ne discipulum abducam, times.

Show code

Icon tabs

Tabs can have icons. Use the icon prop to display an icon inside the tab element.

TeamProjectsTasks

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quid iudicant sensus? Primum quid tu dicis breve? Etiam beatissimum? Ne discipulum abducam, times.

Show code

Boxed tabs

Tabs can be displayed in a boxed style. Use the type prop to display the tabs in a boxed style.

TeamProjectsTasks

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quid iudicant sensus? Primum quid tu dicis breve? Etiam beatissimum? Ne discipulum abducam, times.

Show code

Boxed icons

Tabs can have icons. Use the icon prop to display an icon inside the tab element.

TeamProjectsTasks

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quid iudicant sensus? Primum quid tu dicis breve? Etiam beatissimum? Ne discipulum abducam, times.

Show code

#<BaseTabs>

Model

v-model
Show example

Properties

tabs
An array of tab objects that contain a label and value
Required
Show example
type
The type of tabs to display..

@default

'tabs'

Show example
justify
The horizontal alignment of the tabs.

@default

'start'

Show example
hide-label
Whether or not to hide the label for the tab.
Show example

Slots

#icon
Show example
#tab
Show example