Divider
The v-divider component is used to separate sections of lists.
API
Name
dark
Default
false
Type
boolean
Applies the dark theme variant
Name
inset
Default
false
Type
boolean
Adds indentation (72px) for normal dividers, reduces max height for vertical.
Name
light
Default
false
Type
boolean
Applies the light theme variant
Name
vertical
New in — v1.1
Default
false
Type
boolean
Creates a vertical divider
Examples
Light and dark
Dividers have light and dark variants.
Inset dividers
Inset dividers are moved 72px to the right. This will cause them to line up with list items.
Subheaders and dividers
Subheaders can be lined up with inset dividers by using the same prop.
List dividers
Inset dividers and subheaders can help break up content
Dividers in Portrait View
Create custom cards to fit any use-case
Vertical dividers
Vertical dividers give you even more tools for unique layouts.