Load budget

One row per metric, each a bar on a shared time axis, against a draggable budget line. Rows that finish after the line go amber, then red; the header counts them on an odometer.

Inputs
Drag
Pro

Load budget is part of Pro.

Get Pro to try it live and copy its code, along with every other element in the library.

Get Pro Already Pro? Sign in

Goo switchThe knob is a drop. Flip it and the front of the drop races across on a stiff spring while the back clings on: a neck stretches between them, thins, snaps, and the tail rejoins with a wobble.
Copy fieldA read-only link with a copy button. Pressing it crossfades the icon to a check, pops a "Copied" tooltip, flashes the text as selected and swaps the helper line.
ScoreA rating drawn as hairline circles that fill like cups up to the pointer; the one under it swells and overflows with a drip, and its word types in below. Press sets the score; the number rolls.
Scrub ticksA setting drawn as a ramp of ticks that is also the control. Scrub along it to preview a value in place, with a small delta chip showing the change from where you started; click (or release) sets it.
Email fieldA pill email input with a submit button. A bad press reddens the edge, shakes once and unfolds the reason below; the reason follows the text and leaves as soon as the address is good.
Time railA time of day on a rounded track. Hour labels sit under the major ticks, a notch above and below marks the centre.

Load budget

Load budget is part of Pro.

Related