Bento grid Animated HTML website template

The sample page

Tuckbox. Invoicing for creative studios, Toronto.

The idea

The compartment box becomes the product: every collections task gets its own cell, and the one you touch grows while the others make room.

What to try

Hover (or tab) over the compartments to open them, then open “Deposits, matched” to watch the invoice next door get its Paid stamp.

Made for

Software, apps, portfolios and launches

Palette

• #E9E4DA
• #FFFDF9
• #1E1B24
• #5B3FD1
• #F2A541
• #186B42

Typefaces

Instrument Serif + Geist

Cultural notes

• No real logos or clients: the studio, its clients, and every figure are invented and plausible.
• Current HST and GST rates, with a clear note that Tuckbox isn’t tax advice.
• AA contrast and a visible focus ring on every compartment; with reduced motion, everything holds still.

The HTML

What you download

• A single index.html file with nothing to install: open it, swap in your brand and copy, and upload it to your hosting.
• In English and Spanish, tested on desktop and mobile.
• Instructions for changing copy, colors, language and prices, plus its license.