Laravel FAB Component

Free · MIT

A floating action button component with configurable position, size, color, and expandable action menu.

A FAB built for the TALL stack — Blade, Livewire 3 & 4, Alpine.js and Tailwind CSS 4. Server-rendered by default, dark-mode ready, and WCAG-minded. Drop it in with a single Blade tag: <x-aura::fab>

Try it live in the docs Install free

Installation

composer require bluestarsystem/aura-ui

Usage

<x-aura::fab icon="plus" />

See the full API, props and live examples in the FAB documentation.

Overview

The <x-aura::fab> component renders a floating action button (FAB) fixed to a corner of the viewport. It supports multiple positions, sizes, and color variants. When expandable is enabled, clicking the FAB reveals a list of secondary action buttons from the actions slot.

Props

Prop	Type	Default	Description
`position`	`string`	`'bottom-right'`	Fixed position: `bottom-right`, `bottom-left`, `top-right`, `top-left`.
`size`	`string`	`'md'`	Button size: `sm`, `md`, `lg`.
`color`	`string`	`'primary'`	Color variant: `primary`, `success`, `danger`, `secondary`.
`icon`	`string`	`'plus'`	Icon displayed inside the FAB.
`expandable`	`bool`	`false`	Enable expandable action menu on click.