Float Button

Preview

Create New

Installation

npx skeci-ui add float-button

Usage

import { FloatButton } from '@/components/ui/float-button';
import { Plus } from 'lucide-react';

<FloatButton icon={<Plus />} />

Variants

Variants

Borders

Sizes

Props

Prop	Type	Default	Description
icon	ReactNode	(required)	The icon to display inside the button.
label	string	—	Optional text label for an extended FAB.
variant	'filled' | 'outline'	'filled'	The visual style of the button.
size	'sm' | 'md' | 'lg'	'md'	The size of the button.
rounded	'none' | 'sm' | 'md' | 'lg' | 'full'	'full'	The border radius of the button.
border	'normal' | 'rough' | 'hachure'	'rough'	The sketchiness style of the border.