Getting Started
Templates
Blocks
Components
For solo developers, indie hackers, and freelancers shipping their own products. Pay once, keep everything forever.
Instant download · No subscription · Lifetime access
For small teams, agencies, and freelancers shipping multiple client products. Lifetime access for everyone on your team.
Instant CLI token for 5 seats · Onboarding included · Invoice on request
A floating bottom navigation bar inspired by the macOS dock. Features magnification on hover, expandable panels for different sections, and smooth spring animations. Each icon opens a contextual menu with actions, links, or settings.
Key Features:
| Prop | Type | Default | Description |
|---|---|---|---|
navItems | NavItem[] | Default items | Main navigation icons |
quickItems | QuickActionItem[] | Default items | Quick action buttons with shortcuts |
exploreItems | ExploreItem[] | Default items | Explore categories with counts |
customizeItems | CustomizeOption[] | Default items | Customization options with radio buttons |
connectItems | ConnectItem[] | Default items | Social/connect links |
defaultCustomizeValues | Record<string, number> | { Radius: 2, Scale: 2 } | Initial customize selections |
onCustomizeChange | (type: string, index: number) => void | undefined | Callback when option changes |
className | string | undefined | Additional CSS classes |
| Property | Type | Description |
|---|---|---|
icon | HugeIcon | Icon component |
name | string | Panel name (quick/explore/customize/connect) |
| Property | Type | Description |
|---|---|---|
icon | HugeIcon | Icon component |
text | string | Action label |
shortcut | string | Optional keyboard shortcut |
onClick | () => void | Optional click handler |
| Property | Type | Description |
|---|---|---|
icon | HugeIcon | Icon component |
text | string | Category label |
count | number | Optional item count badge |
onClick | () => void | Optional click handler |
| Property | Type | Description |
|---|---|---|
text | string | Option group label |
options | string[] | Array of option labels |
| Property | Type | Description |
|---|---|---|
icon | HugeIcon | Icon component |
text | string | Link label/title |
href | string | Optional link URL |
Displays a list of actions with optional keyboard shortcuts. Each item shows an icon, label, and shortcut badge.
Shows categories with item counts. Icons animate with a rotation effect on hover.
Radio button groups for settings. Uses animated layout for active state indicators.
Social media links displayed as icon buttons with hover lift effect.
The dock icons use Mac-style magnification:
role="menubar" and role="menu" structurerole="radio" for customize options