Back to components

tick-scale-tabs

Tidewell

A use-case switcher for a fictional harbour-operations scheduling tool, set on a white sheet inside a light grey canvas and framed by solid vertical and dashed horizontal construction guides: a tracked upper-case eyebrow, a two-line serif heading whose italic grey continuation recedes, four segment tabs on one alternating tick ruler with a filled caret and ink tick under the active tab, and a split panel with a square-cornered card (large light serif index, title, description, outlined arrow button that opens an honest local note) beside a blurred original harbour illustration carrying a crisp floating board of timestamped entries with skeleton lines.

Integration

Use the complete component.

Every file is included. Choose a framework to see its setup instructions.

Source & design

Built from a documented study.

Loading the design brief…

For coding agents

Use the public alpha API

The public alpha exposes read-only component APIs and exact versioned downloads. A hosted MCP endpoint is not available yet.

GET /api/components
GET /api/components/:id
GET /api/components/:id/versions/:version/artifacts/:framework

Read-only public alpha · API and downloads available