Usage
The ButtonTheme component provides a simple way to toggle between light and dark themes with animated icon transitions.
ButtonTheme
A theme toggle button component with animated icon transitions between light and dark modes.
Playground
Experiment with the ButtonTheme component properties. Click the button to toggle between light and dark themes.
Properties
color
Color scheme of the button.
animation
Animation type when toggling theme.
size
Size of the button.
Animations
ButtonTheme supports six animation types: fade, rotate, scale, flip, slide, and none.
Fade
Rotate
Scale
Flip
Slide
None
ButtonTheme Props
Props
Prop | Default | Type |
|---|---|---|
animation | "scale" | "fade" | "rotate" | "scale" | "flip" | "slide" | "none" |
color | "neutral" | ButtonProps["color"] |
size | "medium" | ButtonProps["size"] |
...rest | undefined | ButtonProps |