Trellis / Animation library
Trellis
animations.
Interactive illustrations for Trellis’s website and product screens. Preview each animation or download its HTML file.
Table plan
Table plan
Six tables with chairs and place settings.
Move between the tables. The nearest table rises, with its neighbours following.
Kitchen pass
Kitchen pass
Order tickets suspended from a kitchen rail.
Brush the tickets. Each one fans forward from its clip, followed by the papers beside it.
Connected Trellis
Connected Trellis
Orders, kitchen, payments, tables, guests, and reports connected to Trellis.
Lift a module. Its connection to the shared hub comes into focus.
Wine rack
Wine rack
Six bottles stored horizontally in a cellar rack.
Move across the rack. Your chosen bottle slides forward from its cubby.
Tasting flight
Tasting flight
Three stemmed glasses on a tasting paddle.
Move from glass to glass. Each one lifts from the tasting paddle.
Bottle carrier
Bottle carrier
Two wine bottles in a cardboard carrier.
Choose a bottle. It rises from the carrier, ready for a closer look.
Corkscrew
Corkscrew
A corkscrew pulling a cork from a bottle.
Move upward over the bottle. The corkscrew draws the cork out of the neck.
Decanter
Decanter
A glass decanter that tilts with the pointer.
Move from side to side. The decanter tilts toward the pointer, then returns to rest.
Service bell
Service bell
A service bell with a rocking dome and fixed base.
Sweep across the bell. Its dome rocks around the base, then settles.
Place setting
Place setting
Two plates, a folded napkin, a fork, and a knife.
Move upward. Plates, linen, and cutlery lift apart to reveal the setting.
Receipt roll
Receipt roll
A paper roll feeding a receipt.
Move downward. The receipt feeds from its roll, revealing the next few lines.
Takeaway bag
Takeaway bag
A paper bag with an opening mouth and loop handles.
Move toward the handles. The mouth widens and the handles lift.
Garden trellis
Garden trellis
An arched lattice in a planter, with three climbing vines.
Move upward to grow the vines. Leaves unfurl behind each growing tip.
Logo trellis
Logo trellis
The POS logo lattice inside a rounded trellis, with alternating columns rotated 180 degrees.
Move upward to trace the interlocking logo lattice.
Building trellis
Building trellis
A trellis assembling from its base, using the POS logo lattice.
Move upward. The uprights and arch build first, followed by the interlocking logo pieces.
Line trellis
Line trellis
A rounded trellis with each logo drawn as a single stem and four branches.
Move upward to trace the lattice. Alternating columns interlock with a 180-degree rotation.
Downloads
Use these
animations.
Each HTML file opens locally and includes play, theme, and intensity controls. Use the Trellis animation component to embed these illustrations in a website or product screen.
Original Trellis figures, built on Hairline by Lucas Marques. MIT licensed.