Basic

A nav-segmented with text nav-link items is enough for a plain control.

Any content

Items can be any short text, including emoji.

Icons only

Put only an icon in each nav-link for an icon-only control.

With icons

Combine an icon and text in each nav-link to label each option.

Vertical

Add nav-segmented-vertical to stack the options in a column.

Vertical with disabled items

Add disabled to a nav-link to make that option unselectable.

Disabled items

Disabled options stay visible but can't be selected.

Vertical, no icons

A vertical control also works with text-only items.

Independent group

Use radio inputs with a unique name so this control doesn't share selection state with others using the same items.

Full width

Add w-100 to stretch the control across its container.

Full width, stacked

Multiple full-width controls, one above the other.

Sizes

Add nav-sm or nav-lg to change the size — with text, icons, or both.