Hex Tally
A metric card that lands while a hex unit chart fills in under a running total.
How it moves
The card settles up 19px onto its resting place; 150 hexagons out of a 22×15 field light up one at a time in a measured scatter — faster through the middle of the run, seeding the blob's rim before its interior — and the headline counts flat, 217 a frame, landing a tenth of a second before the chart does. The legend under it never moves: it is the still thing the two moving clocks are read against, and every percentage in it is counted off the grid rather than typed beside it, so a share can never be a number somebody forgot to update. Card settle, per-cell reveal times and the blob itself are measured tables.
Installation
$ pnpm dlx shadcn@latest add @snapcn/hex-tallyNeeds an existing Remotion project and a components.json. Two-minute setup if this is your first snapcn component.
Frequently asked questions
How do I add Hex Tally to a Remotion project?
Hex Tally is part of snapcn Pro, and installs with the same shadcn CLI as every free component: npx shadcn@latest add @snapcn/hex-tally. The source is copied into your project and is yours to edit — there is no runtime package to keep installed.
What is Hex Tally?
Hex Tally is a Remotion unit chart animation for React. A metric card that lands while a hex unit chart fills in under a running total.
Is Hex Tally free?
No. It is one of 48 Pro components, sold together: $129 a year for the whole catalogue and everything that ships while your year runs, or $249 once to own it outright. The other 41 snapcn components are free and MIT.