Appearance

Updated on Oct 6, 2026

The FloatingToolBar lets you customize its size and fill mode.

• Size
• Fill Mode

The following example demonstrates the available appearance options of the FloatingToolBar.

Example

View Source

Loading ...

Size

To specify the size of the FloatingToolBar, use the size property. It accepts values of type ToolbarSize.

The available size values are:

• small
• medium
• large

If you do not set size, the currently applied theme controls the size.

The following example demonstrates the available size values side by side.

Example

View Source

Loading ...

Fill Mode

To set the fill mode of the ToolBar hosted inside the FloatingToolBar, use the fillMode property. It accepts values of type ToolbarFillMode.

The available fill-mode values are:

• solid
• flat
• outline

If you do not set fillMode, the currently applied theme controls the fill mode.

The FloatingToolBar forwards fillMode to its hosted ToolBar, but does not pass it to child tools. Set fillMode on each child button to apply a fill mode to those buttons as well.

The following example applies each available fillMode value to the FloatingToolBar and its child tools.

Example

View Source

Loading ...

Suggested Links

• API Reference of the FloatingToolBar