Timelines

The v-timeline is useful for stylistically displaying chronological information.

API

v-timeline
Имя
align-top
По умолчанию
false
Тип
boolean

Components.Timelines.

Имя
dark
По умолчанию
false
Тип
boolean

Применяет тёмный вариант темы

Имя
dense
По умолчанию
false
Тип
boolean

Components.Timelines.

Имя
light
По умолчанию
false
Тип
boolean

Применяет светлый вариант темы

Примеры

Small dots

Easily alternate styles to provide a unique design.

Icon dots

Conditionally use icons within the v-timeline-item's dot to provide additional context.

Avatar dots

Insert avatars into dots with use of icon slot and v-avatar.

Colored dots

Colors dots create visual breakpoints that make your timelines easier to read.

Opposite slot

The opposite slot provides an additional layer of customization within your timelines.

Dense alert

Dense timelines position all content to the right. In this example, v-alert replaces the card to provide a different design.

Advanced

Modular components allow you to create highly customized solutions that just work.

Edit this page | language on Github
Vuetify 3 is now available!The latest version of Vuetify is now available!
Learn about Vuetify 3's new features and functionality for modern Vue applications
Start exploringExplore