FlipDot

A cascading dot-flip grid that simulates a physical flip-dot display. Dots flip with spring physics in a diagonal cascade pattern.

GitHub

Install

npm install animated-digit-transitions

Usage

import { FlipDot } from "animated-digit-transitions";

export function MyComponent() {
  const [digit, setDigit] = useState(0);
  return <FlipDot value={digit} size={64} />;
}

Props

Prop	Type	Default	Description
value	number	0	Digit to display (0-9)
size	number	64	Width in pixels. Height is 1.5x width.