Floe UI LogoFloe UI
DocsComponentsSeparator

Separator

Layout

A visual divider — horizontal or vertical rule styled with design tokens.

Preview

Content above

Content below

Left
Right

Variants

Section A
Section B
Horizontal
Left
Right
Vertical

Usage

separator.rs
use floe_ui::components::separator;

"text-zinc-500">// Horizontal divider
let hr = separator::horizontal(&tokens);

"text-zinc-500">// Vertical divider
let vr = separator::vertical(&tokens);

API Reference

Props / Parameters

NameTypeDescription
tokens&DesignTokensDesign tokens for theming

Style Functions

default_style(tokens)

Style functions return closures compatible with Iced's .style() method.

Builder Functions

horizontal(tokens)
vertical(tokens)

Builder functions return pre-configured Iced widgets ready for use.

Source: floe-ui/src/components/separator.rs