Components not listed in the sidebar are not available yet.
Vuetify 2 documentation can be found on vuetifyjs.com
v-timeline is useful for stylistically displaying chronological information.
Switch between a horizontal and vertical timeline in real-time using the direction prop.
Use the side property to force all items to one side of the timeline.
v-timeline-item content is vertically aligned
center. The align prop also supports
# Dot color
Colored dots create visual breakpoints that make your timelines easier for users to read.
# Icon dots
Use icons within the
v-timeline-item dot to provide additional context.
The size prop allows you to customize the size of each dot.
# Truncated line
Truncate the start, end or both ends of the timeline center line by using the truncate-line prop.
# Line inset
Modify the inset of dividing lines by specifying a custom amount using the line-inset prop.
It is not possible to use the line-inset prop together with the truncate-line prop. The line-inset prop will take precedence if both are specified.
Insert avatars into dots with use of the
icon slot and
The opposite slot provides an additional layer of customization within your timelines.