FAB Theme Picker
Menus and commandsMITFloating theme switcher button — palette swatches and dark/light toggle.
bun add @otfdashkit/ui
Preview
FAB Theme PickerMenus and commands
Code
@otfdashkit/uiimport { FloatingThemePicker } from '@otfdashkit/ui'
export function Example() {
return (
<div className="relative w-full h-[400px] bg-background flex items-center justify-center">
<div className="text-center space-y-1">
<p className="text-sm font-semibold text-foreground">FloatingThemePicker</p>
<p className="text-xs text-muted-foreground">Click the palette button — bottom right</p>
</div>
<FloatingThemePicker />
</div>
)
}
Free with the SDK. This block ships in @otfdashkit/ui under the MIT license.
Props
Props declared in the FloatingThemePicker source. Inherited HTML attributes are not listed.
| Prop | Type | Default | Description |
|---|---|---|---|
| className | string | ||
| options | ThemePickerOption[] | ||
| position | 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left' | 'bottom-right' |