Divider

Dividers are thin lines that group content into sections. They can be horizontal or vertical, with optional inset and middle variants.

Horizontal

Item 1

Item 2

Item 3

<me-divider></me-divider>

Inset

The inset variant adds a left margin (72px) to align with list content.

Ali

Blake

Casey

<me-divider variant="inset"></me-divider>

Middle

The middle variant insets from both sides.

Content above

Content below

<me-divider variant="middle"></me-divider>

Vertical

Use orientation="vertical" inside a flex container. Set align-self: stretch or give the container a height.

Left

Center

Right

<div style="display:flex;align-items:center;height:40px"> <span>Left</span> <me-divider orientation="vertical"></me-divider> <span>Right</span> </div>

Light

Above

Below (light divider)

<me-divider light></me-divider>

API

Attribute	Type	Default	Description
`variant`	fullWidth \| inset \| middle	fullWidth	Controls indentation.
`orientation`	horizontal \| vertical	horizontal	Direction of the divider.
`light`	boolean	false	Lightens the divider color.