Animate UI

Flip

A button that flips between two states on hover.

Made by imskyleen
Edit on GitHub
Open in

Installation

Usage

<FlipButton>
  <FlipButtonFront>Front</FlipButtonFront>
  <FlipButtonBack>Back</FlipButtonBack>
</FlipButton>

API Reference

FlipButton

PropTypeDefault
from?
'top' | 'right' | 'bottom' | 'left'
top
tapScale?
number
0.95
...props?
HTMLMotionProps<"button">
-

FlipButtonFront

PropTypeDefault
transition?
Transition
{ type: 'spring', stiffness: 280, damping: 20 }
...props?
HTMLMotionProps<"span">
-

FlipButtonBack

PropTypeDefault
transition?
Transition
{ type: 'spring', stiffness: 280, damping: 20 }
...props?
HTMLMotionProps<"span">
-

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