InkBloom

An ink-in-water dissolve effect where digits bloom in with blur and scale, creating an organic morphing transition between values.

GitHub

Install

npm install animated-digit-transitions

Usage

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

export function MyComponent() {
  const [digit, setDigit] = useState(0);
  return <InkBloom 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.