@holbech/react-flip-card v0.0.4

ReactFlipCard

Install

npm install @holbech/react-flip-card

Usage

import ReactFlipCard from "@holbech/react-flip-card";

...

return (
    <div style={{ "--width": "500px", "--height": "500px" }}>
      <ReactFlipCard>
        <p>Front</p>
        <p>Back</p>
      </ReactFlipCard>
    </div>
)

Options

ReactFlipCard works on hover, but you can also control it through state/props

<ReactFlipCard showBack={true}>

Notes

1. This is just an example, it's not "production ready".
2. The containing element must have a width/height (set through custom props)