Animate UI

Theme Toggler Button

A button that toggles the theme gradually.

Made by imskyleen
Edit on GitHub
Open in

Installation

Usage

<ThemeTogglerButton />

API Reference

ThemeTogglerButton

Animate UI API Reference - Theme Toggler Primitive
PropTypeDefault
variant?
"default" | "accent" | "destructive" | "outline" | "secondary" | "ghost" | "link"
default
size?
"default" | "sm" | "lg"
default
modes?
('light' | 'dark' | 'system')[]
lightdark
direction?
'btt' | 'ttb' | 'ltr' | 'rtl'
ltr
onImmediateChange?
(theme: 'light' | 'dark' | 'system') => void
-
...props?
React.ComponentProps<"button">
-

Credits

  • Credit to shadcn/ui for style inspiration.
  • Credit to Magic UI for the component inspiration.

Built by Skyleen. The source code is available on GitHub.