Core / Controls
Floating Action Button
Keeps one high-priority action available over content.
Live example
The source Floating Action Button is fixed to the viewport’s bottom-right corner.
Interactive preview using local sample data. Styling is intentionally left to the consuming project.
Usage
<FloatingActionButton aria-label="Create item" />Adopt to your project
Keep this component semantically neutral. Use its documented props for behavior and className for project-specific spacing, width, typography, and visual treatment.
Accessibility
Use an aria-label for icon-only controls.
API reference
| Public attribute |
|---|
icon |
label |
position |
onClick |
The preview above uses a safe local fixture. Confirm exact TypeScript props when adapting it to your application.
Installation
Full library
pnpm install:project /absolute/path/to/your-project
Planned guided selection
Controls → Floating Action Button