Separator

A thin themed line used to visually divide sections of a layout. Renders horizontally by default and stretches to fill the available space.

Usage

Orientation

The default orientation is 'horizontal'. Pass orient='vertical' for a vertical divider; use length= to constrain its height.

# Vertical divider between breadcrumb items
with bs.HStack(gap=12, anchor_items="center"):
    bs.Label("Home")
    bs.Separator(orient="vertical", length=16)
    bs.Label("Products")
    bs.Separator(orient="vertical", length=16)
    bs.Label("About")
    bs.Separator(orient="vertical", length=16)
    bs.Label("Contact")

Accent colors

By default the line color is derived from the active surface. Pass an accent= token to apply a semantic color.

bs.Separator(accent="default")
bs.Separator(accent="primary")
bs.Separator(accent="secondary")
bs.Separator(accent="info")
bs.Separator(accent="success")
bs.Separator(accent="warning")
bs.Separator(accent="danger")

Thickness

The default thickness is 1 px (theme-controlled). Use thickness= for a heavier rule.

bs.Separator(accent="primary", thickness=1)
bs.Separator(accent="primary", thickness=2)
bs.Separator(accent="primary", thickness=4)

Widget sizing

All widgets accept self-placement kwargs via **kwargs. The parent container determines which options apply — stack-based parents use stack kwargs, grid-based parents use grid kwargs. Unrecognised keys are silently ignored.

Stack

Used inside VStack, HStack, App, and other stack containers.

fill	Fill direction: 'x', 'y', 'both', or 'none'.
expand	Grow to consume extra space in the parent. True or False.
anchor	Alignment when the widget does not fill the available slot: 'n', 's', 'e', 'w', 'center', 'nw', etc.
margin	External spacing in pixels. Accepts an integer (equal on all sides), a 2-tuple (horizontal, vertical), or a 4-tuple (left, top, right, bottom).
margin_x	Horizontal external spacing (left and right). Accepts an integer or a 2-tuple (left, right) for asymmetric spacing. Overrides the horizontal component of margin=.
margin_y	Vertical external spacing (top and bottom). Accepts an integer or a 2-tuple (top, bottom) for asymmetric spacing. Overrides the vertical component of margin=.

Grid

Used inside a Grid container.

row / column	Zero-based row and column indices.
rowspan / columnspan	Number of rows or columns to span.
sticky	Alignment and fill within the grid cell. Any combination of 'n', 's', 'e', 'w' — e.g. 'ew' stretches horizontally, 'nsew' fills the entire cell.
margin	External spacing in pixels. Accepts an integer, a 2-tuple (horizontal, vertical), or a 4-tuple (left, top, right, bottom).
margin_x	Horizontal external spacing. Accepts an integer or (left, right).
margin_y	Vertical external spacing. Accepts an integer or (top, bottom).

API

The complete reference for Separator lives on the Widgets API page. At a glance:

Separator

A horizontal or vertical dividing line.

Full Example

with bs.App(title="Separator Demo", size=(680, 520), padding=20, gap=24, fill_items='x') as app:

    with bs.VStack(gap=10, fill_items='x'):
        bs.Label("Accent Colors", font="heading-sm")
        for accent in ("default", "primary", "secondary", "info", "success", "warning", "danger"):
            bs.Separator(accent=accent)

    with bs.VStack(gap=10, fill_items='x'):
        bs.Label("Thickness", font="heading-sm")
        for t in (1, 2, 4):
            bs.Separator(thickness=t, accent="primary")

    with bs.VStack(gap=8, fill_items='x'):
        bs.Label("Vertical Orientation", font="heading-sm")
        with bs.HStack(gap=12, anchor_items="center"):
            bs.Label("Home")
            bs.Separator(orient="vertical", length=16)
            bs.Label("Products")
            bs.Separator(orient="vertical", length=16)
            bs.Label("Contact")

    # Full-width in-context examples
    with bs.VStack(fill_items='x'):
        bs.Label("In Context", font="heading-sm")
        with bs.HStack(gap=32, anchor_items='n'):
            with bs.VStack(gap=6, fill_items='x'):
                bs.Label("Profile", font="heading-md")
                bs.Separator()
                bs.Label("Name: Ada Lovelace")
                bs.Label("Role: Engineer")

            with bs.VStack(gap=6, fill_items='x'):
                bs.Label("Danger Zone", font="heading-md")
                bs.Separator(accent="danger", thickness=2)
                bs.Label("Irreversible action below", accent="danger")

app.run()