Flip Card
3D flip card that turns on hover, focus or click, is keyboard accessible and cross-fades under reduced motion.
Copy a prompt for your AI coding tool with the source, dependencies and usage
Props
FlipCardProps
Also accepts all props of Omit<React.ComponentProps<"button">, "children" | "onClick">
| Prop | Type | Default | Description |
|---|---|---|---|
| front* required | React.ReactNode | — | — |
| back* required | React.ReactNode | — | — |
| label | string | "Flip card" | Accessible name for the toggle button |
| frontClassName | string | — | — |
| backClassName | string | — | — |
Install
$ npx shadcn@latest add https://chromotion.dev/r/flip-card.json