Skip to content

FloatButton

A circular action button fixed to the bottom-right corner of the page by default, for quick actions like "New" and "Feedback"; supports a badge and a custom icon.

The demos add style="position: static" to avoid fixed positioning affecting the page layout; in real use it is fixed to the bottom-right by default.

Basic usage

With badge

Without badge

Without badge

Custom icon

Custom icon

Event feedback

Click event

API

Attributes

AttributeDescriptionTypeDefault
badgeBadge number at the top-right cornerstring

Events

EventDescription
oas-clickClicked, detail: { originalEvent }

Slots

NameDescription
icon

Slots: icon (default +). The default position is position: fixed; bottom/right, overridable via host element styles.