piruicy
The collection

Toolbar morph

after Rauno Freiberg

A floating toolbar whose label slides between tools, and whose menu grows into a command palette.

npx shadcn@latest add https://piruicy.com/r/toolbar.json

Toolbar
Layout Shifts
Interaction Timing
Accessibility
Bundle Size
Open Graph
Comment
Feature Flags
Draft Mode

Details

  • A 204×44 bar of 32px buttons; 16px glyphs at 1.5px strokes, as measured from Rauno's recordings.
  • The label slides between tools through a clipped window on a spring (324/33), fitted over 13 slides.
  • The menu grows the bar into a 560×500 palette: opening on 240/28, closing on 272/32.
  • Icons blur and drop 16px with a 20ms stagger; the palette's content rises 12px from +220ms.

© 2026 Dhaval Khandhadia. Use it in anything you build; don’t resell it. MIT with the Commons Clause.